I need to hide .meta
elements only if there are not other .meta
elements in the list.
Basically I need the same behavior of :only-of-type
but for classes.
So, if I have:
<table>
<tr class="meta"><td>lorem</td></tr>
<tr class="row"><td>row</td></tr>
</table>
.meta
will be hidden
If I have:
<table>
<tr class="meta"><td>lorem</td></tr>
<tr class="row"><td>row</td></tr>
<tr class="meta"><td>lorem</td></tr>
</table>
.meta
will be shown.
The CSS should looks like:
.meta:only-of-class { display: none; }
Is it possible with pure CSS?
Edit:
I've even tried with this markup (not much W3C compilant but who care):
<table>
<tr><th class="meta"><lorem</th><tr>
<tr class="row"><td>row</td></tr>
</table>
With this CSS:
th:only-of-type { display: none; }
But it doesn't work (and here I've not really idea of why it doesn't)