I don't know of a way of using logic (identifying a value in a tag and doing something particular) using just CSS and HTML, you'd need Javascript or some such for this. But if you're looking to hide the second p element in the text block you can do this using the nth-of-type CSS selector:
Wrap your p tags in a div and give the div a class.
<div class="HideChild">
<p>te</p>
<p>st</p>
<p>ing</p>
</div>
Then in your css create a selector like this:
.HideChild p:nth-of-type(2)
{
display: none;
}
Wrapping the p tags in a div and using a class means you can reuse this function for multiple text blocks on your page. If you want to change which line is hidden change the number after nth-child, and if you want the page to show a gap where the line should be replace display: none
with visibility: hidden
.
Under what conditions should it be hidden? I'm assuming you're looking to hide it programmatically – CLockeWork – 2013-11-28T10:02:30.013
It should be hidden if the HTML element has "st" text inside it, and its the second element there. I dont know any better way to tell which element to hide, unless CSS has a feature to point at n'th element somehow? – Rookie – 2013-11-28T10:05:35.533
CSS does indeed have such a feature: http://www.w3schools.com/cssref/sel_nth-child.asp
– CLockeWork – 2013-11-28T10:22:02.223