Formazione web: XHTML e CSS2
Il Box Model - Prima Parte -
Il Box-model è uno degli aspetti più importanti per quanto riguardo gli elementi a livello di blocco.
Ogni box model è caratterizzato da:
- Larghezza dei contenuti (proprietà width)
- Altezza dei contenuti (proprietà height)
- Spazio tra contenuti e bordi (proprietà padding)
- Bordo (proprietà border)
- Spazio tra bordo e altri oggetti della pagina (margin)
Si noti che la larghezza totale del box model corrisponde alla somma della larghezza dei contenuti più il padding e lo spessore dei bordi.
Il Browser web Internet Explorer utilizza un box model differente da quello appena visto, infatti le versioni 5 e 5.5 considerano tali caratteristiche:
Come potete notare dall’immagine la proprietà width e height corrispondono alla larghezza e altezza totale del box model, e non come avevamo visto nell’immagine precedente che corrispondevano alla larghezza e altezza dei contenuti. Questa è una sostanziale differenza in quanto potrebbe dar luogo a problemi non poco importanti per la corretta visualizzazione della pagina.
