Link copiato negli appunti
I margini orizzontali sono sempre trattati separatamente, mentre i margini verticali tra due elementi
adiacenti vengono collassati, cosa che molti non sanno. Consideriamo per esempio il seguente codice HTML
con stili in linea:
<div style=”margin: 100px”>Primo div</div>
<div style=”margin: 50px”>Secondo div</div>
Il primo div ha tutti i margini pari a 100px, mentre il secondo div ha margini di 50px.
Quale sarà la distanza verticale che li separa? Molti penseranno che sia 150 pixel.
In realtà la distanza che li separa è 100 pixels. Infatti la distanza verticale effettiva tra due elementi
con margini diversi da zero viene resa come il maggiore tra i due valori dei margini verticali coinvolti.