Почему при открытии клавиатуры сбрасываются css стили? И что с этим делать?

Question

[jonnyEkb]

Для отображения на мобильных платформах используем в css

@media only screen and (min-width: 320px) and (max-width: 374px) and (orientation: portrait){
...
}

На android возникла следующая проблема.
все отлично работает ровно до момента получения фокуса любым полем ввода, а точнее пока на экране не появляется клавиатура. В этот момент начинают использоваться десктопные стили, и форму разрывает по ширине. При скрытии клавиатуры всё возвращается к исходным размерам.
Почему такое происходит и что с этим делать?

Answer 1

[Котик Антон]

Скорее всего подобное происходит из-за этого условия: (orientation: portrait).

Что с этим делать? Убрать это условие не вариант?

Подобный вопрос на SO:
stackoverflow.com/questions/8883163/css-media-quer...

Comments

[jonnyEkb]

Действительно помогло. Но почему так происходит? Из-за клавиатуры получается что высота меньше ширины и это засчитывается за изменение ориентации устройства?