округленное текстовое поле css

Question

Я нашел этот код здесь: http://www.cssportal.com/form-elements/text-box.htm Но проблема в том, что вы все равно можете видеть прямоугольную форму текстового поля при каждом щелчке внутри него. Что бы исправить это? Так что подсветка будет идти с изображением с закругленными углами

/* Rounded Corner */
.tb5 {
    background: url(images/rounded.gif) no-repeat top left;
    height: 22px;
    width: 230px;
}
.tb5a {
    border: 0;
    width:220px;
    margin-top:3px;
}

Answer 1

Это должно происходить только в некоторых браузерах, таких как Google Chrome, оно предназначено для удобства использования и доступности, но может вызвать проблемы с некоторыми стилями. То, что вы хотите сделать, это удалить динамические контуры , например:

input[type="text"] { 
    outline: none;
} 

Кроме того, вы можете попробовать по-прежнему выделять текстовое поле, включив изменение фонового изображения с помощью пседо-селектора, например: focus

input[type="text"]:focus { 
    background: url(images/rounded-focused.gif) no-repeat top left;
}