Question

I want to totally hide everything in the .byline except the date. Is it possible to do this via CSS w/o modifying the markup? Is there a CSS selector that allows you to target the inner text that’s not in tags?

<p class="byline">
    By <a rel="author" href="#">John Doe</a>
    on <time datetime="2012-10-10" pubdate>2012</time>
</p>

This does not work b/c it hides the a but not the other text:

.byline :not(time) { display:none }

This does not work b/c it hides everything:

.byline { display:none }
.byline time { display:inline }

This works but is not ideal b/c then you have to deal with hiding the space too:

.byline { visibility:hidden }
.byline time { visibility:visible }

See: jsfiddle.net/pxxR7/ and jsfiddle.net/pxxR7/1/

Answer 1

you can use font-size DEMO

.byline {font-size:0px; }
.byline time {font-size:15px}