Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    [newbies]-margini e box model

    ciao a tutti,
    complimenti per il portale, veramente utile e ricco di informazioni.
    Sto studiando proprio sul vostro portale i CSS e mi ritrovo subito a dover affrontare alcuni problemi:


    <body>
    <div id="container"></div>
    </body>

    lo stile e':

    html,body{margin: 0;padding:0}

    body
    {
    background-color: #E1D2C6;
    height: 100%; font-family: arial,sans-serif;font-size: 76%;text-align: center
    }

    div#container
    {
    width: 800px;
    height: 100%;
    margin:10 auto;
    background-color: white
    }


    Perche' sia con firefox che con explorer il margine del conteiner superiore
    appare mentre quello inferiore no ? In fondo ho un box dentro al viewport. Impostando un margine del box non si dovrebbe vedere sia sopra che sotto?

    Perche' eliminando lo stile "text-align:center" nel body, _solo mozilla_ mi
    mostra centrato il container mentre in explorer va tutto a sinistra? Non
    dovrebbe bastare "margin:10 auto;" nello stile del container?


    Scusate le domande sciocche ma leggendo mi sembrava tutto semplice, alla prova dei fatti le cose ovvie scompaiono e rimangono solo montagne da scalare anche per le cose piu' stupide...

  2. #2
    Frontend samurai L'avatar di fcaldera
    Registrato dal
    Feb 2003
    Messaggi
    12,924

    Re: [newbies]-margini e box model

    Originariamente inviato da marco_jf
    Perche' sia con firefox che con explorer il margine del conteiner superiore
    appare mentre quello inferiore no ? In fondo ho un box dentro al viewport. Impostando un margine del box non si dovrebbe vedere sia sopra che sotto?
    Probabilmente perchè imposti ad un'altezza identica due elementi annidati. Se diminuisci un pò l'altezza del container che cosa succede?

    Originariamente inviato da marco_jf
    Perche' eliminando lo stile "text-align:center" nel body, _solo mozilla_ mi
    mostra centrato il container mentre in explorer va tutto a sinistra? Non
    dovrebbe bastare "margin:10 auto;" nello stile del container?
    Si bastarebbe se Explorer fosse un browser che segue gli standard. Poichè non lo è
    (anche in moltissime altre cose) è necessario dare tex-align: center all'elemento che racchiude il contenitore

    Ciao
    Vuoi aiutare la riforestazione responsabile?

    Iscriviti a Ecologi e inizia a rimuovere la tua impronta ecologica (30 alberi extra usando il referral)

  3. #3

    Re: Re: [newbies]-margini e box model

    Originariamente inviato da fcaldera
    Probabilmente perchè imposti ad un'altezza identica due elementi annidati. Se diminuisci un pò l'altezza del container che cosa succede?
    Si bastarebbe se Explorer fosse un browser che segue gli standard. Poichè non lo è
    (anche in moltissime altre cose) è necessario dare tex-align: center all'elemento che racchiude il contenitore

    Ciao
    Grazie della rapida risposta. Ti spiego cosa intendo realizzare: praticamente vorrei creare un box che sia sempre distanziato, sopra e sotto, dal bordo del viewport di 10 px. Naturalmente se i contenuti eccedono la larghezza della finestra si attiva lo scroll laterale del browser, che una volta fatto raggiungere il fondo della pagina risultino esserci nuovamente visibili i 10 px.

    e poi volevo capire come funzionano il padding e i margini: ho letto sul box model diversi articoli ma non mi hanno chiarito bene alcune cose:

    supponiamo che io realizzi 2 box annidati. Se dico che il box 2 e' contenuto nel box 1 e che il box 2 ha altezza pari al 100% i due box coincidono giusto?

    Se volessi mettere un bordino in giro al box 2, considerando i due box ridimensionabili con i contenuti, come si deve fare? ponendo nel box 2 un margin di 2px non si dovrebbe risolvere la questione? Oppure prevale l'altezza 100% messa come caratteristica del box2?

    Spero di essere stato abbastanza chiaro.....

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.