CSS + Opacity change on Hover + Flickering

Ha, it's almost the same problem the webkit sometimes have. So, I've tried to emulate the fix for webkit (the one with -webkit-transform: translateZ(0)), but using the 2D transform, and it worked!

So, it seems like just adding -moz-transform: rotate(0); to the elements that are affected by flickering solves the problem: http://jsfiddle.net/kizu/yfhTW/4/

Try to add the border: 1px solid transparent; to the element (not to :hover pseudoclass). It worked for me.

For people coming here who have an image with an opacity that isn't 1, and have a similar flicker, make sure you set background-color:white; on the image! I know this doesn't resolve the question at hand but it is a similar problem.

.post img { opacity:.8; background-color:white; }
.post:hover img { opacity:1; }