web-dev-qa-db-fra.com

Supprimer l'ombre intérieure de textarea sur Mobile Safari (iPhone)

Par défaut, il semble que Mobile Safari ajoute l'ombre interne supérieure à tous les champs de saisie, y compris textarea. Y a-t-il un moyen de l'enlever?

C'est particulièrement moche quand vous avez un fond blanc.

iphonemobilemobile-safari
137
Lyon

En ajoutant ce style css:

-webkit-appearance: none;
313
Lyon

Tout en ajoutant le style CSS

-webkit-appearance: none;

va travailler, il se débarrasse de tout. Vous voudrez peut-être essayer ceci à la place:

box-shadow: none !important;

De cette façon, vous gardez la flèche vers le bas.

23
Justin Tolchin

Voici la solution facile

input[type=text] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
14
IqbalBary

Parfois, vous pouvez avoir une feuille de style qui a cassé le appearance: none; alors un moyen de le réparer quand cela se produit est d'utiliser caret. Le meilleur moyen sera de réécrire votre code et de découvrir ce qui en fait partie, ce qui perturbe le style de none

Avant d'utiliser caret, vous devez savoir qu'il peut vous causer des problèmes avec d'autres styles.

-webkit-appearance: caret;
   -moz-appearance: caret;
     -o-appearance: caret;
        appearance: caret;

NOTE: Utiliser none, caret n'est pas optimal.

8
TheCrazyProfessor

https://stackoverflow.com/a/51626446/9287284

background-clip: padding-box; 

et j'ai trouvé un même commentaire plus ancien réponses ici.

https://stackoverflow.com/a/29750016/9287284

0
Sika Uma