What does `content:""` do?

So, in this lesson, it is said:

When the ::before and ::after pseudo-elements are used to make shapes, the content property is still required, but it’s set to an empty string.

Could anyone explain exactly why is this?

::before and ::after are for putting some content before or after an element, like some text, or an icon or whatever. An empty string indicates that there isn’t any content, ie you’re just using the pseudo element to cause some visual effect. If there was no content at all (either that attribute was missed out, or content is set to “none”), the element would collapse to nothing.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.