Il modello di box: Internet Explorer vs. W3C

25

Oggi, il problema del modello di box Internet Explorer è principalmente un problema. La maggior parte degli sviluppatori web inserisce un tag <!DOCTYPE> per far rispettare la conformità agli standard e nessuno si preoccupa più di supportare Internet Explorer 5.5.

Tuttavia, alcuni sviluppatori hanno escogitato argomenti soggettivi e concettuali in difesa del modello di box IE. Hanno affermato che il modello di box IE è più "intuitivo" del modello W3C, perché il modello W3C misura il contenuto della scatola, mentre il modello IE misura la scatola stessa:

Riescoavedereilloropuntodivista,mafondamentalmenteèunargomentosoggettivo,elacosapiùimportanteèlastandardconformità.

Tuttavia,recentementesonoarrivatoapreferireilmodellodiboxIEperragionigravipratiche.IlmodelloboxW3Crendedifficileridimensionaredinamicamenteunelementoallalarghezzaesattadipixelsuschermodiunaltroelemento.Ilmotivoèchelaproprietàstyle.widthdiunelementonontienecontodelladimensionetotalesuschermodell'elemento:devianchetenercontodieventualibordiepaddingaggiuntivi.QuestononèunproblemaseentrambiglielementiusanolastessaclasseCSS-masehannodiverseclassiCSS,questopuòdiventareincredibilmentedifficile.

Supponiamodiavereduediv:AeB.Aèhard-codednelhtmlcomeundiv400px,mentreBècreatodinamicamenteusandoJavascript.Visivamente,vogliamocheBsialalarghezzaesattadiA.SottoilvecchiomodellodiIEBox,questoèbanale.Diciamosemplicemente:B.style.width=A.style.widthoancheB.style.width=A.offsetWidth+"px" .

Ma con il modello box W3C, non è così semplice. Ora dobbiamo anche preoccuparci dei fogli di stile. Se B ha la stessa classe CSS di A, possiamo solo dire B.style.width = A.style.width . Ma se così non fosse - e non potremmo volere per ragioni estetiche - siamo nei guai. Ora dobbiamo prendere in considerazione i pixel totali nel bordo e il padding di entrambi A e B. Questo può essere particolarmente difficile se il bordo e il padding sono specificati in unità incoerenti (un'occorrenza comune dato che il confine è spesso una linea 1px, mentre il padding potrebbe essere specificato in ems). Quindi ci troviamo di fronte a quasi-impossibile compito di conversione in un'unità comune (em a px o px in em). Tutto questo solo per ottenere due div in linea esattamente sullo schermo.

Quindi, in sostanza, il modello box W3C ci obbliga a prendere in considerazione i problemi del bordo e del padding CSS quando impostiamo la dimensione di un elemento, mentre il modello box IE non lo fa, poiché la larghezza misura l'intera dimensione della casella (end-to-end), anziché il contenuto della casella. Questo rende molto più facile dimensionare dinamicamente gli elementi in relazione l'uno con l'altro.

Tutto questo sembra un motivo abbastanza potente per favorire il modello di box IE sul modello W3C (almeno concettualmente - ovviamente in pratica il modello di box IE è morto).

Domanda : perché il W3C ha scelto questo modello di box? Ci sono alcuni vantaggi del modello di box W3C che semplicemente non vedo? O sto semplicemente esagerando il problema qui?

    
posta Channel72 07.05.2012 - 14:37
fonte

1 risposta

9

La scelta se includere padding e border nella larghezza o meno era arbitraria. L'unica cosa che importava era la costruzione di layout a più colonne. Tuttavia, è necessario tenere conto del fatto che le persone hanno utilizzato tabelle per i layout in quel momento comunque. Quindi a loro la preoccupazione non sembrava abbastanza importante e hanno considerato che essere in grado di specificare la larghezza esatta che il contenuto stesso avrebbe occupato in CSS sembrava molto più prezioso.

Per gli sviluppatori di oggi la situazione sembra completamente diversa in quanto utilizzano i CSS per i layout e devono affrontare il modello di boxing CSS. Per fortuna abbiamo la possibilità di ignorare le regole di box, quindi nella maggior parte dei casi la regola semplice nella parte superiore del foglio di stile funziona in modo favoloso:

* {
    -mox-box-sizing: border-box;
    box-sizing: border-box;
}

Per citare Jeff Kaufman sull'argomento :

Given that the spec defined it the other way, though, the signal it would have sent to Microsoft to adopt their misinterpretation would have been bad for the web. Microsoft was already using an embrace, extend, and extinguish approach, where they intentionally made products that acted differently from competitors' in order to lock users into the Microsoft versions. They came very close to succeeding with the web: from approximately 2000 to 2005 IE was so popular that many sites designed just for it. Adopting IE's approach here then might have told Microsoft "you can do whatever you want with IE and we'll adjust the standards to make it legal".

Quindi il modello di box è caduto vittima di problemi di potere tra W3C e Microsoft.

    
risposta data 08.05.2012 - 13:14
fonte

Leggi altre domande sui tag