DEV Community 👩‍💻👨‍💻

Discussion on: Add Some Bounce to your Forms with Animated Floating Labels

Collapse
 
k1dv5 profile image
Kidus Adugna

Nice article. On question, instead of using labels, couldn't we just move the placeholder itself out of the input when the input is focused? (Haven't tried it but just an idea)

Collapse
 
dianale_dev profile image
Diana Le Author

I think the placeholder is pretty limited in terms of what you can style with CSS. Also the other main issues are that the placeholder text will go away once you fill in the text input, and they don't provide information for accessibility like form labels do.

Collapse
 
k1dv5 profile image
Kidus Adugna

You're right. My idea was to move the placeholder upward once the user starts typing, but when I tried to change its margin, it disappeared into the input border and changing the z-index didn't have any effect.