Стилизация invalid полей?

Question

[Дмитрий]

Есть такое поле

<input type="text" required  pattern="([a-zA-Z0-9]*)">

Если поле не соответствует паттерну, то оно должно окрашиваться в красный (срабатывает псевдокласс :invalid). Но у меня есть еще атрибут required, который проверяет поле на пустоту. То есть по умолчанию поле будет красным тк пустое. Как то переопределить для :required не получается. Как сделать пустое поле как при фокусе не прибегая к js?

Answer 1

[Антон]

Разве не работает?

:invalid, :invalid:required {
}