The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Style content according to the HTML text within an tag

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #35679

    Ive been looking all over and have not found a way (if there is a way) to do this. Is it possible to style an element (lets say a span), according to the HTML text inside of it? For example, if within the span it says “open”, like this:

    Registration is currentlyopen

    Is there a way to say, HTML text “open” = green. Is this possible? I appreciate any insight. Thanks!


    I don’t think this can be done purely with CSS. However, I’m sure it’s possible to add a class to an element if the contains certain content with jQuery/JS. This way you can style the element to the class that gets assigned from the jQuery/JS.

    I just don’t know how to write it for you or else I would. :)


    Thanks for the feedback. Very helpful. The jQuery one is exactly what i was looking for. Maybe one day this will be possible merely through CSS, but i’m hoping the jQuery method will work for now. Testing…


    Yes! The jQ worked. thanks again! Another item for my code library : )
    Final solution:

    Color test

    This thing is open.

    This thing is closed.


    There is a pure CSS solution (IE8+), albeit using an attribute to store the desired text.
    The end result is conditional styling, based on data you input.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.