alsacreations / KNACSS

feuille de styles CSS sur-vitaminée
http://www.knacss.com
Do What The F*ck You Want To Public License
554 stars 116 forks source link

Placeholder #276

Closed raphaelgoetter closed 6 years ago

raphaelgoetter commented 6 years ago

Depuis Firefox 51, cette fonctionnalité est implémentée via le pseudo-élément standard ::placeholder.

https://developer.mozilla.org/fr/docs/Web/CSS/::-moz-placeholder

PhilippeVay commented 6 years ago

:-moz-placeholder actuellement en place dans KNACSS ne fonctionne déjà plus avec Fx 56 et c'est OK avec ::placeholder 👍

Pour rappel l'ancienne version de Fx ESR était 45.x (avant l'actuelle 52.x)

PhilippeVay commented 6 years ago

@raphaelgoetter Il se passe des choses bizarres au passage d'Autoprefixer dans cette version 7.0.4.

Avant – _forms.scss :

::-webkit-input-placeholder {
  color: #777;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #777;
}

input::placeholder,
textarea::placeholder {
  color: #777;
}

Après – knacss-unminified.css :

::-webkit-input-placeholder {
  color: #777;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #777;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #777;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: #777;
}

input::placeholder,
textarea::placeholder {
  color: #777;
}

Il y a le problème des webkit d'une part et… un petit tour sur Caniuse pour mieux comprendre ce que fait Autoprefixer 😛

Partial support refers to using alternate names: ::-webkit-input-placeholder for Chrome/Safari/Opera (Chrome issue #623345) :-ms-input-placeholder for IE. ::-ms-input-placeholder for Edge (also supports webkit prefix)

-moz- est supprimé puisqu'on ne demande pas le support de Fx 50 (j'aurai à l'ajouter dans un futur projet), dont acte.