CSS: pseudo-classes with classes

I have the following html code:

<article class="category-future-exhibitions">
<p>some text</p>
</article>
<article class="category-future-exhibitions">
<p>some text 1</p>
</article>
<article class="category-future-exhibitions">
<p>some text 2</p>
</article>

I needed to add some text before first line of “some text”.

The following css snippet shows how to do it:

*:not(.category-current-exhibitions) + article.category-current-exhibitions p:before {
    content: "Current";
    font-weight: bold;
    width: 100%;
    display: block;
    text-transform: uppercase;
}

Leave a Reply

%d bloggers like this: