CSS Only Floated Labels with :placeholder-shown pseudo class

Limbaje de Programare HTML & CSS
1

O tehnică tare interesantă. Nu merge pe IE sau pe Edge, dar… e o treabă de luat în seamă :slight_smile:

floated-labels-with-placeholder-shown-demo.gif786×419 62.4 KB

4 Likes
2

Pare sa existe polyfill: https://github.com/sesubash/placeholder-shown-polyfill

3

E de urmarit. Se poate ajunge la acelasi efect si cu pseudoclasele din form validation, mai precis :valid, care au suport pe IE si Edge (https://caniuse.com/#feat=form-validation). Practic, adaugi required pe input, apoi in CSS stilizezi label in functie de validitatea input-ului. Exemplu: https://codepen.io/anon/pen/mGgLyq

Evident, nu e chiar cea mai buna solutie, pentru ca in unele cazuri nu vrei sa ai form validation.

1 Like