css - Can you add line breaks to the :after pseudo element?

Question

I want to append a <br /> to a particular class. Using the :after pseudo class simply displays <br /> as text.

Is there a way to make this work?

It's internal for IE8 so browser issues aren't a problem. If I do

<span class="linebreakclass">cats are</span> brilliant

I want "brilliant" to appear on a new line.

Answer 1

You won't be able to render HTML tags but you can set style like this:

.needs-space:after {
    content: " ";
    display: block;
    clear: both; /* if you need to break floating elements */
}

The main setting here is display: block; This will render :after content inside a DIV. And this pseudo element is supported by all latest browsers. Including IE. Saying this you should be aware of your users and their browsers.