The content property is mostly used with pseudo-elements like ::before and ::after. And in most cases, it’s empty, because it serves some other purpose like overlay, or line, etc.
The content property is often underestimated due to its lack of a11ty. One of the major issues is that you can not translate CSS. In the next example, we are using content property so we can add the $ symbol at the end.
See the Pen Content by webinuse (@webinuse) on CodePen.
But what if we decide to translate to another language with another currency? Use attributes. That way you can translate HTML, change attributes dynamically, etc.
See the Pen gOpZgNj by webinuse (@webinuse) on CodePen.
If you have any questions about me or my blog you can find me on Twitter, or you can learn more about me and my blog on this link.