Form label animation shake in webkit / safari
Opened this issue · 2 comments
haveanicedavid commented
In safari, there’s a shake in the form label when the input gains focus:
Compared to Chrome (where it doesnt happen):
Beautiful lib of web-components! I’m very new to lit, but if there’s any way I can help troubleshoot, please let me know 😄
kjantzer commented
Interesting...
I'll be honest, I dont really ever test in Safari. Most development testing is targeted to Chrome/Edge (blink)
Seems like it's a weird css issue. Maybe could be more apparent if the animation was slowed down in dev tools?
kjantzer commented
Oh, looks like it might stem from animating font-size and translate at the same time, since translateY(50%) is relative to the element size