Questo è un paragrafo a cui abbiamo assegnato margini di 1em
Questo è un altro paragrafo a cui abbiamo sempre assegnato margini di 1em. La distanza verticale fra i due paragrafi dovrebbe essere di 1em o di 1em + 1em = 2em?
Questi paragrafi usano i margini di default del browser.
Qui sotto tre paragrafi: quello in mezzo è senza contenuto. Non è nemmeno visibile.
Questo è un paragrafo a cui abbiamo assegnato margini di 1em
Questo è un altro paragrafo a cui abbiamo sempre assegnato margini di 1em. La distanza verticale fra i due paragrafi dovrebbe essere di 1em o di 1em + 1em = 2em?
Sotto alcuni esempi manipolati per comprendere il fenomeno del margin-collapsing.
Applicazione del background
Vediamo lo stesso qui sotto, aggiungendo i bordi al contenitore:
Questo è un paragrafo a cui abbiamo assegnato margini di 1em
Questo è un altro paragrafo a cui abbiamo sempre assegnato margini di 1em. La distanza verticale fra i due paragrafi dovrebbe essere di 1em o di 1em + 1em = 2em?
La presenza o meno di bordi (ma anche di padding verticale) negli elementi contenitori di elementi con margini verticali modifica l’applicazione del background dell’elemento contenitore. Anche i margini partono dai bordi.
In terms of the box model, “background” refers to the background of the content, padding and border areas. Border colors and styles are set with the border properties. Margins are always transparent. CSS 2.1