venerdì, gennaio 21, 2005

Box Model Reloaded

A proposito dell'annosa questione del box model, cioe' del fatto che W3C lo vuole in un modo e IE lo fa in un altro. Esistono una serie di trucchi per aggirare l'inconveniente ma ci sono due soluzioni piu' "eleganti", che vado ad illustrare.

*** Doctype - from IE to W3C

If you use a doctype to switch to 'Strict mode', Explorer 6 Windows and Opera 7 switch to the W3C box model.
Vedi articolo su: msdn.microsoft.com
[ Works on IE6 and Opera7 ]

*** Box Sizing - from W3C to IE

A new CSS3 declaration currently under consideration at W3C allows you to switch box models easily. The official syntax is:
box-sizing: border-box
box-sizing: content-box
The first declaration will cause the box sizes to be applied to the border and everything inside it (traditional model), the second one will cause the box sizes to be applied to the content only (W3C model).
[ Works on Explorer 5 Mac / Opera 7 ]

Mozilla supports its own variation of this declaration:
-moz-box-sizing: border-box;
-moz-box-sizing: content-box;
-moz-box-sizing: padding-box;
The first two declarations behave exactly like their CSS3 counterparts. The third one is a Mozilla extension: it will cause the box sizes to be applied to the padding and everything inside it.
[ Works on Mozilla ]

Nota: le proprieta' di Mozilla che iniziano con "-moz" sono proprieta' aggiunte dai programmatori ma che non sono compliant con le specifiche W3C, o perche' non esiste la proprieta' analoga o perche' il team Mozilla non l'ha ancora implementata correttamente o perche' il W3C non l'ha ancora approvata

Nessun commento:

Posta un commento