Brian
Brian

Reputation: 2829

IE10 Hover + Pseudo Elements

Example: http://codepen.io/mastastealth/pen/gFjhi

Basically, I have an element with an :after element set to opacity 0. On hover, it goes to opacity 1. Apparently it works in IE9 and everywhere else, but not IE10 (unless I click)? Ideas?

Upvotes: 3

Views: 1979

Answers (2)

Castyr
Castyr

Reputation: 380

It appears there is a bug where the selector with a pseudo class followed by a pseudo element is not listened for when an event happens. If you add the listener by simply adding the selector with only the pseudo class your style will be applied on the event occurring.

http://codepen.io/justinphillips/pen/qvHyi

.p:hover:after {
    opacity: 0.7;
  } 

.p:hover {}

Upvotes: 5

Brian
Brian

Reputation: 2829

Apparently IE10 continues the horrible bug of not accepting :hover on divs. Example updated using an element instead and it works fine.

Upvotes: 0

Related Questions