Como evitar o rastro azul em volta dos inputs e textareas no Safari

Postado por: Pedro Rogério em

No Safari, quando temos o foco em algum campo input ou textarea, você pode ver que em volta deles é formado um rastro de cor azul para dizer que o campo ganhou o foco. Isso, por questões de acessibilidade é muito interessante, mas se você tem alguma imagem de fundo nos inputs que não tenham borda, isso é meio desastroso. Para solucionar esse problema, vaos utilizar a propriedade outline do CSS, que é a mesma uilizada para remover as linhas que ficam em volta dos links:


input, textarea  {
    outline:none;
}

Pronto, agora você não tem mais nenhum rastro azul em volta dos inputs e textareas.

Referências

Posts Relacionados

Confira também outros artigos interessantes postados aqui no blog.

Sobre Pedro Rogério

Pedro Rogério é desenvolvedor web por paixão, não saberia fazer melhor outra coisa. Além de escrever para o Pinceladas da Web também escreve para o CSS no Lanche, blog voltado ao desenvolvimento front-end.

4 Responses to “Como evitar o rastro azul em volta dos inputs e textareas no Safari”

  1. jonathan

    essa propriedade também evita o pontilhado ao redor de um link ou imagem no IE.

  2. klawdyo

    O chrome também tem essa viadagem

  3. @Klawdyo,

    Por que ele utiliza o mesmo motor de renderização do Safari.

  4. Cara, obrigado, já estava com essa pulga atrás da orelha há um tempão pra resolver. Abs.

Leave a Reply