1

Possible Duplicate:
CSS 3 content selector?

I was wondering, is it possible to select an element based on its content with CSS?

I realize I can use something like this:

.this[href="./foo.php"] {
    /* And the styles... */
}

But is there a way to select based on inner content?

So if I have this:

<p>[ Continued ]</p>

How can I select it based on it's content, [ Continued ], if I can?

Community
  • 1
  • 1
sackbot14
  • 201
  • 1
  • 3
  • 8

1 Answers1

1

No, not with CSS, and there really should never be a need too. If you're making a "Continued" button, link, or whatever: specify a class, maybe an ID, or even use an attribute, and select it. There really is no need for a content selector with how many options you already have.

Not to mention, not adding a class or some kind of identification to this link makes it look like regular text within the document, possibly removing some of its semantic meaning. Giving it a separate class makes it stand out. If I give a link the class "button," that makes it stand out from the rest of the links on the page, saying "I'm a button, not just an ordinary link." Selecting based on the content does nothing of the sort; it's just another link.

animuson
  • 53,861
  • 28
  • 137
  • 147
  • Well I am using a phpBB forum and installed an addition and cannot seem to find out how to add a class to something (did not create the addon), and so I can't find a way to get rid of it. I will look though. :P Thanks – sackbot14 Feb 07 '12 at 04:51
  • There was going to be a `:contains()` pseudo-class but it was cut for reasons unknown. See [this answer](http://stackoverflow.com/a/4781167/106224). It's probably something to do with performance (every single ancestor would match a bare `:contains()` selector for a given string), along with, like you say, the options *already* available. – BoltClock Feb 07 '12 at 04:55
  • Wait nevermind I found it :D So yeah.. this is pointless, if only I knew how to delete it.. – sackbot14 Feb 07 '12 at 04:55
  • @sackbot14: There's no reason to delete anything. It's a valid question that others may also be interested in. – animuson Feb 07 '12 at 04:57
  • @sackbot14: I'll close this for you, but I won't delete it as I think it's worth keeping. (Not every duplicate needs to be deleted.) – BoltClock Feb 07 '12 at 04:57
  • Let's say I have a basket summary page. There is a column for the price of each item, (i.e. "$ 4.00") but some of them are free and I want to highlight them. They don't show as cost 0.00, they show with "FREE" and I want that word to appear bold and glowing. I can add javascript that changes the mapping of the HTML and adds a class "make-free-cost-seem-nicer" for instance, but if I'm going to use javascript I can also use "$(td:contains('FREE')" and get it over with. If I want to do that with *ONLY* CSS and HTML I can't. So *there is a need* for it. – Isaac Llopis Apr 10 '15 at 08:41
  • `No, not with CSS, and there really should never be a need too.` Indeed. Besides, it would violate the whole premise of separating styling, content, structure, and behavior. – Synetech Jul 06 '15 at 21:59