tachyons icon indicating copy to clipboard operation
tachyons copied to clipboard

Published 20 hours ago • verified publisher icon tachyons-css

Strange safari behaviour when hovering over element using "dim class"

Open ray-ben opened this issue 8 years ago • 5 comments

When using the dim class on graphical elements, they move a bit on hover: dim-hover

Or check it out live here hovering the social icons in the footer component.

Happens only in safari, chrome seems to be fine.

ray-ben avatar Feb 24 '17 14:02 ray-ben

Weird, not happening anymore.

ray-ben avatar Feb 27 '17 16:02 ray-ben

Still happening on my end. Might have a fix. Will try to address it soon. Thanks for pinging me with this.

mrmrs avatar Feb 28 '17 17:02 mrmrs

Wasn't sure whether it was only because of an extension or so, that's why I closed it. At least we have proof now that it's not only happening for me.

ray-ben avatar Feb 28 '17 17:02 ray-ben

Update: have tried to fix this a few time but have failed so far. Will keep at it. Accepting PRs if someone else has a fix though :)

mrmrs avatar May 01 '17 14:05 mrmrs

.dim{transform:translateZ(0);opacity:1} must be applied to prevent bouncing on hover. I came across this when resolving a glitch on .grow:hover. You can see the outcome of that here: https://codepen.io/inspiredlabs/pen/qwpWrq

inspiredlabs avatar Apr 16 '19 11:04 inspiredlabs