There is a simple div with img inside, hover is hanging on this diva, with hover opacity 0.6 with transition 0.5s is superimposed on the picture. In firefox and only in it, when hovering over this element, it twitches, if the transition is removed, it stops.

a { display: block; transition: opacity 0.5s; } a:hover { opacity: 0.6; } 
 <div><a href=""><img src=""></a></div>

    1 answer 1

    The fact is that when using transition block redrawing occurs. Because of this, such twitching may occur. To solve the problem, I advise you to use the "zero" hack:

     a { transform: translateZ(0); }

    The essence of this method lies in the fact that when the browser detects this property, it sends the rendering of this block to the GPU. In turn, the graphics accelerator performs the property, and then caches its result in its video memory.