If I have markup:
<div class="a b"></div>
where the .a class has a hover class associated with it
and the .b class has a pseudo element associated with it... like so:
div
{
width: 100px;
height: 100px;
}
.a { background: red; display: inline-block; }
.a:hover { background: green; }
.b:after
{
content: '';
display: inline-block;
width: 100px;
height: 100px;
margin-left: 100px;
background: pink;
}
Is it possible with css to prevent a pseudo element from triggering the .a class hover?
See Question&Answers more detail:os