Margin, padding or spaces for BR tags

[picophd]

I found it fairly challenging to find a solution for this problem about margin space after a BR tag, so I thought I'd share what worked perfectly for me, with an addon / extension like Stylish for Chrome / Firefox, for example, and I'm guessing that it could be useful for CSS programmers / scripters too.

Of course, feel free to enhance or tweak if you're an expert!

br
{ content: "A" !important;
 display: block !important;
 margin-bottom: 1.5em !important;
}

[alt131]

Hi picophd, given the lack of suggested tweaks means the experts are away at the moment! I enjoyed the opportunity to remember the humble <br> can be styled, but a couple thoughts about the example posted.

Adding the content property is interesting - but note it applies to the :before/:after pseudo elements, plus <br> should be empty. So I was a bit surprised that Op11 rendered the content (but required display:block to implement the line break as well.) That said, after a quick test (ie8, winSaf5 and ff8) Op was the only version that did not respect a line-height and vertical align applied to the <br>, but only Op and ff applied margin-bottom.

What is the reason for trying to add a bottom-margin to a line-<br>eak? I'm asking because a line break just indicates where a line of text should break. If the desired outcome is to increase the vertical distance between lines of text then why not do so using line-height (plus vertical-align if required)?

[g1smd]

Very often when people need a bigger line break, the content should have been broken into two separate paragraphs.