Perché getComputedStyle non prende in considerazione la compressione dei margini?

Question

Per quanto riguarda JavaScript nel browser, il metodo window.getComputedStyle() deve fornire i valori finali utilizzati delle proprietà CSS applicate a un elemento. Secondo lo MDN documentation, ciò significa "dopo che tutti i calcoli sono stati eseguiti".

Tuttavia, sembra che "tutti i calcoli" non includano il crollo dei margini. In Firefox e Chrome (almeno), l'istruzione getComptedStyle().marginBottom restituisce il valore calcolato prima che sia stato calcolato qualsiasi collasso di margine.

Ad esempio, si consideri il seguente elemento:

<div style="margin: 10px 0 15px 0"></div> 

suoi margini superiore e inferiore saranno crollati perché (approssimativamente) la sua altezza contenuto è zero (cfr the W3C CSS2 Recommendation). I metodi CSSOM torneranno questi valori:

getComputedStyle().marginTop → 10px 
getComputedStyle().marginBottom → 15px 
getBoundingClientRect().top → {top of margin box} + marginTop 
getBoundingClientRect().bottom → idem top 

Ma, a causa di margine collasso, il layout mostra un margine di 10px prima del rettangolo di delimitazione client, e un margine di 5px dopo, cioè max(0, marginBottom - marginTop).

Perché lo getComputedStyle().marginBottom non restituisce direttamente 5px, il valore utilizzato reale "dopo che tutti i calcoli sono stati eseguiti", invece del 15px specificato? Si tratta di un comportamento consigliato dal W3C? (Non ho visto nulla di questo nei documenti di w3.org.)

Si tratta di un bug o di una funzionalità?

Answer 1

Non vedo tutto il codice, ma penso che il nome della funzione sia effettivamente "getComputedStyle" con una "u".

Un errore di battitura? Potrebbe essere così facile? Non saresti il ​​primo - me compreso.

Sperando che questo aiuti.