Bootstrap: Safari + Chrome: input [type = search] .form-control com o atributo results exibe a decoração dos resultados incorretamente

Criado em 18 abr. 2016 · 3Comentários · Fonte: twbs/bootstrap

Em navegadores baseados em webkit, uma tag <input> de type="search" , de class="form-control" E o histórico de resultados ativado ( results="x" ) exibe a lista suspensa de resultados incorretamente:

no Safari no OSX - parece cortar (o ícone de lupa) à esquerda
no Chrome (49) - parece deixar um amplo espaço à esquerda

  <input type="search" class="form-control" results="10">

Estou ciente de que o TWBS é responsável por _selector _ :: - webkit-search-cancel-button, mas não consigo encontrar uma referência a _selector _ :: - webkit-search-results-button

Exemplo em JSFiddle

css v3

Fonte

vinorodrigues

Todos 3 comentários

Olá @vinorodrigues!

Você parece ter postado um exemplo ao vivo (https://fiddle.jshell.net/vinorodrigues/sLgwgcqa/show/light/), que é sempre um bom primeiro passo. No entanto, de acordo com o validador HTML5 , seu exemplo contém alguns erros de validação , que podem estar causando o problema:

linha 74, coluna 1 a coluna 73: Atributo results não permitido no elemento input neste ponto.
linha 81, coluna 1 a coluna 94: Atributo results não permitido no elemento input neste ponto.

Você precisará corrigir esses erros e postar um exemplo revisado antes de prosseguirmos.
Obrigado!

(_Por favor, note que este é um comentário totalmente automatizado._ )

twbs-lmvtfy em 18 abr. 2016

👎1 👍1

Verdadeiro - results não são atributos HTML5 padrão per se - mas eles fazem parte do webkit ... usado tanto no Safari quanto no Chrome.

Veja esta referência e os documentos do

vinorodrigues em 18 abr. 2016

👍1

O Bootstrap 3 não está mais sendo desenvolvido ou suportado oficialmente.

Todo o trabalho mudou para nosso próximo lançamento principal, v4. Dessa forma, esse problema ou solicitação de pull está sendo encerrado como um "não corrigirá". Para obter ajuda e suporte adicionais, recomendamos a utilização de nossos recursos da comunidade . Obrigado pela sua compreensão e nos vemos do outro lado da v4!

<3,
@mdo e equipe