Sometimes, we want to use CSS :before and :after pseudo-elements with inline CSS.
In this article, we’ll look at how to use CSS :before and :after pseudo-elements with inline CSS.
How to use CSS :before and :after pseudo-elements with inline CSS?
To use CSS :before and :after pseudo-elements with inline CSS, we can add a style element.
For instance, we write
<style>
td {
text-align: justify;
}
td:after {
content: attr(data-content);
display: inline-block;
width: 100%;
}
</style>
<table>
<tr>
<td data-content="post"></td>
</tr>
</table>
to add a style element with the styles we want.
Then the styles will be applied to the table next to it.
Conclusion
To use CSS :before and :after pseudo-elements with inline CSS, we can add a style element.
