iOS safari: (-webkit-) box-shadow на входе: фокус не работает - PullRequest
7 голосов
/ 04 октября 2011

Safari ведет себя странно по отношению к box-shadow.

input[type="text"]{
    -webkit-box-shadow: 0 0 8px #000000;
    box-shadow: 0 0 8px #000000;
}
input[type="text"]:focus{
    outline: none;
    -webkit-box-shadow: 0 0 8px #ffffff;
    box-shadow: 0 0 8px #ffffff;
}

Отображается box-shadow, но как только элемент фокусируется, тень полностью исчезает. Тот же эффект произойдет, если вы ничего не установили в: focus.

Работает на Desktop-Safari. Я использую бета-версию iOS 5 (iPad), я не могу проверить ее на стабильном выпуске или других устройствах.

У кого-нибудь есть решение этого?

1 Ответ

22 голосов
/ 05 октября 2011

Используйте -webkit-Appearance: нет, чтобы переопределить собственный вид:

input[type="text"]{
    -webkit-appearance: none;
    -webkit-box-shadow: 0 0 8px #000000;
    box-shadow: 0 0 8px #000000;
}
...