How to select a text node with CSS

css-selectors, html

Solution

The current state of CSS can't do this, check this link: W3C

The problem here is that the content you write to the screen doesn't show up in the DOM :P.

Also `::outside` doesn't seem to work yet (at least for me in Safari 6.0.3) or it simply doesn't generate the desired result yet.

Check my fiddle and then check the DOM source: JSfiddle

Finally there are attribute selectors `a { content: attr(href);}`, making CSS able to read DOM-node attributes. There doesn't seem to be a `innerHTML` equivalent of this yet. It would be great tho if that was possible, whereas you might be able to manipulate the inner markup of a tag.

Problem

I have the following HTML markup: ``` <h1> <div class="sponsor"> <span>Hello</span> </div> World </h1> ``` When I use the CSS selector `h1` I get `Hello World`. I can't unfortunately change the markup and I have to use only CSS selectors because I work with the system that aggregates RSS feeds. Is there any CSS selector which I can take only the text node? Specifically the `World` in this example?

Original source

Related problems