Tenho um input[type=search]
com padding
. Como quero ter o mesmo estilo em browsers diferentes usei -webkit-appearance: none;
mas no Safari 7 (mavericks pelo menos) O botão que faz reset/cancel da busca fica cortado. Como posso corrigir isto?
Tenho estado a tentar com o seletor ::-webkit-search-cancel-button
que funciona por exemplo para o econder (display: none;
) mas não o consigo mudar mais para a esquerda...
Sugestões?
jsFiddle: http://jsfiddle.net/hjtkarLc/
O setup do jsFiddle:
CSS
input {
float: left;
clear: both;
margin: 1em;
}
input[type="search"] {
-webkit-appearance: none;
}
#withPadding {
padding: 0.7em;
}
HTML
<input type="search" value="I'm ok" />
<input type="search" id="withPadding" value="I'm cutoff" />