Dicas de CSS: Comando Outline
CSS - Remover borda de links comando outline com CSSSombras em textos e objetos com CSS3
Hoje vamos mostrar como retirar aquela borda luminosa que aparece nos formulários e alguns outros itens em alguns navegadores.
Como sempre citamos cada navegador interpreta cada site de seu próprio jeito, e um bom exemplo disso é quando preenchemos um formulário.
Quando clicamos na caixa de texto o Google Chrome e o Safari criam uma borda luminosa ao redor do campo.
Como podemos ver no IE e no firefox a única borda que temos é a que foi configurada previamente via CSS.
Já nos Navegadores Chrome e Safari temos essa outra borda mais chamativa em cima da borda já configurada.
Resolvendo o Problema:
A solução é bem simples e iremos usar apenas um comando CSS.
input[type=text]{outline:none}
Esse comando CSS irá remover a borda da caixa de texto mas pode ser usado em qualquer outro tipo de campo que aparece essa borda como o select.
Esse comando outline é um comando muito útil pois podemos usar em outros tipos de tags.
Veja os exemplos abaixo com e sem Outline:
Arte e Desenvolvimento