Removing a word from a <p> only using css

Question

Due to mod rights on a site, I can only add css (no js etc...). When users input text in a comment box, it saves it and then displays it as a <p>. is there any way through css i can search for a specific word in the <p> tag and remove/censor it?

Thanks

Answer 1

There is no practical solution for that ( You may be able to select elements based on the value and hide them in CSS3 but it wouldn't be cross-browser friendly, if at all possible ). I'm afraid you'll have to use JS/server-side for a real solution.

On the hacky side of things and for IE only, you may be able to use an expression and display:none elements which contain certain strings in their nodeValue, it wouldn't work for modern browsers.

Answer 2

If parent element in this case input field has class or id you can hide elements inside like this
textarea#mytextarea p{
display:none;
}

Answer 3

• Once upon a time, there was a pseudo-class :contains() in the wonderful spec of CSS3 selectors ... but it disappeared early and afaik well before any implementation.

• A JS solution has one problem: search bots and any user without JS (or displaying the source code) will see the f***ing original text :)