Is there some way to visualize whitespaces in text using only CSS without altering the original HTML code? Lets say the HTML is:
<div class="paragraph">Lorem ipsum dolor sit amet,<br/>consectetur adipiscing elit.</div><div class="paragraph">In augue ipsum, iaculis vel dapibus ut, viverra ut tellus. In ornare euismod leo a ultrices.</div>
- paragraph end (¶) -> can use
:after
- line break (↵) -> can use
:after
- space (·) -> the only way I can think of is to prepend all spaces with something like
<span class='space' />
and the use:after
The last one does not fulfill the condition to use only CSS and original HTML. Is there some way to do that?
EDIT: as requested, here is CSS for the pilcrow sign after the paragarph:
.paragraph:after { content: "¶"; }
:after
?<div class="paragraph">
? That's exactly what the<p>
tag is for!