search

anydigital / float-label-css

Bulletproof CSS-only implementation of Float Label pattern with automatic fallback for ANY non-supporting browser.
https://codepen.io/tonystar/pen/JRLaKw
MIT License
261 stars 28 forks source link

Don't works without placeholder #29

Open Klemart3D opened 3 years ago

Klemart3D commented 3 years ago

Float label works with placeholder="" but it don't works without placeholder attribute in an input element.

I found a workaround by styling an invisible placeholder if it is equal to # (like to disable href="#" links), by adding this code in input, select, textarea { } selector :

&[placeholder="#"]::placeholder {
    color:transparent;
}