JSFiddle - React, Tailwind, and code Playground

by cssGuy

HTML

<!-- BEFORE & AFTER PSEUDO ELEMENTS -->
<p>content</p>

CSS

/* TRY TO SELECT TEXT AND SEE THE BEHAVIOR OF GENERATED CONTENT. IT CAN'T BE SELECTED BECAUSE IT IS NOT IN DOM. */

p::before {
    content:"before - ";
    font-weight: bold;
}
p::after {
    content:" - after";
    font-weight: bold;
}