Targeting text nodes with CSS

Question

I\'m working on the CSS for a container object. I have it mostly working. Specifically, I\'m looking at test case 1, 2 and 3. They all have text nodes. Is there a way to tre

Answer 1

Only text that is wrapped in HTML tags can be targeted by CSS.

Your text that is not explicitly wrapped by HTML tags is algorithmically wrapped by anonymous boxes. These boxes may inherit styles, but they cannot be targeted by CSS.

From the spec:

9.2.1.1 Anonymous block boxes

The properties of anonymous boxes are inherited from the enclosing non-anonymous box. Non-inherited properties have their initial value.

If adding HTML tags around your anonymous text is not an option, consider setting the text styles on the container. For the elements that can be targeted, you can then override the container styles. Of course, this method will fall flat if you want the text to have display: none.