.parent{
transform-style: preserve-3d;
.child{
top: 50%;
transform: translateY(-50%);
backface-visibility: hidden;
filter: blur(0);
}
&:hover{
transform: translateY(-80%);
}
}
Sometimes when transitioning a transformed object (mostly using the transform horizontal center technique) on hover, you get jumpy / glitchy text movements, and when using transform3d to it or backface-visibility to fix that, you get blurred text, this solves that. Well... it worked for me
Be the first to comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.