Home > Article > Web Front-end > How to Rotate a Unicode Symbol in a Pseudo-Element?
Question:
How can you rotate a pseudo-element's content value given that they are inline and can't be directly transformed?
Specifically, we want to rotate a Unicode symbol.
<code class="css">::after { content: "B6"; }</code>
Answer:
Inline elements cannot be transformed, and pseudo elements are inline by default. To make them transformable, you must set their display property to either block or inline-block.
<code class="css">#whatever:after { content: "B6"; display: inline-block; transform: rotate(30deg); }</code>
<code class="html"><div id="whatever">Some text</div></code>
The above is the detailed content of How to Rotate a Unicode Symbol in a Pseudo-Element?. For more information, please follow other related articles on the PHP Chinese website!