I have the following HTML:
<div class="outer">
<a class = "content" href= "........">
// a lot of different divs in here
</a>
<div class = "label">
Label
</div>
</div>
I want to apply styling to the label
class if the link of class content
is visited.
My CSS is the following:
.content:visited + .label {
color: gray;
}
However, even when my link is visited, the label still shows unvisited state. After some research I found "If you use sibling selector such as :visited + span, the adjacent element will be styled as if the link were unvisited" at https://developer.mozilla.org/en-US/docs/Web/CSS/Privacy_and_the_:visited_selector.
Is there any workaround with pure CSS to make my use case work? Seems like this would be a common scenario.