KNACSS : icon input[type="search"]

xxFyl

21 May 2019 à 11:48

Bonjour,

Lorsque j'utilise un input[type="search"] avec Knacss, l'icon natif (la croix) qui réinitialise la saisie ne s'affiche pas.

J'ai essayé de forcer son apparition via un

input[type="search"] {
  -webkit-appearance: searchfield !important;
}

mais ça ne fonctionne pas.

Quelqu'un aurait une idée ?

Merci.
Modifié par xxFyl (21 May 2019 - 11:48)

kustolovic

Modérateur

21 May 2019 à 12:07

Bonjour, il se pourrait que ce soit lié à cela dans Knacss:


[type="search"] {
  &::-webkit-search-decoration,
  &::-webkit-search-cancel-button,
  &::-webkit-search-results-button,
  &::-webkit-search-results-decoration {
    display: none;
  }
}

xxFyl

21 May 2019 à 13:12

kustolovic a écrit :
Bonjour, il se pourrait que ce soit lié à cela dans Knacss:


[type="search"] {
  &amp;::-webkit-search-decoration,
  &amp;::-webkit-search-cancel-button,
  &amp;::-webkit-search-results-button,
  &amp;::-webkit-search-results-decoration {
    display: none;
  }
}

J'utilise Bretzel donc je ne peux pas les décommenter. J'ai donc ajouté un display: block !important sur ces propriétés dans mon propre style ET celles-ci :


[type='search'] {
  [type='search']::-webkit-search-cancel-button {
  -webkit-appearance: searchfield-cancel-button;
 }
}

Après tout ça, ça fonctionne. Merci
Modifié par xxFyl (21 May 2019 - 13:26)

CSS et mise en forme, CSS3

KNACSS : icon input[type="search"]