HTML CSS examples for CSS Widget:Hover
Prevent a pseudo element from triggering hover
<html> <head> <title>Lorem ipsum dolor sit amet, </title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> div<!-- w ww . ja va 2 s. co m--> { width:100px; height:100px; } .a { background:red; display:inline-block; } .a:hover { background:green; } .c:hover { background:blue } .b:after { content:''; display:inline-block; width:100px; height:100px; margin-left:100px; background:pink; } .a.b:after { pointer-events:none; } .c.b:after { display:block; } </style> </head> <body> Lorem ipsum dolor sit amet, cons <pre>Lorem ipsum</pre> <br> <div class="a b"></div> <br> <br>Lorem ipsum d <pre>Lorem ipsum</pre> <br> <div class="c b"></div> </body> </html>