It is somewhat common to use the <br />
tag (a line-break) to increase space between block elements.
<style>
p {
margin-top: 32px;
margin-bottom: 32px;
}
</style>
<p>Paragraph One</p>
<br />
<p>Paragraph Two</p>
Regrettably, this has an adverse effect on our margins:
The <br />
tag is invisible and empty, but any element between two others will block margins from collapsing. Elements need to be adjacent in the DOM for their margins to collapse*.
Top comments (0)