java acm java acm - 26 days ago 11
CSS Question

Element moved when I hover mouse

Why when I hover mouse on cards image moved ?!

I am trying to fix it and I find when I remove page

direction
and or remove
overflow-y
from
#center
it's fixed but I need them !!



even when I inspect elements in cards and mouse hovering could to see all elements are moved but shown correct !
I guess it's maybe page rendering problem in chrome browser

in fact what is problem and how can I to fix it technically ?


JSFiddle Demo

Answer Source

This issue appears to be a Chrome bug according to this topic: image moves on hover - chrome opacity issue and I think you should setting position:relative to inner img solves the problem