Привет, пытаюсь понять min-width/max-width & orientation: portrait/landscape для мобилных.
Когда тестирую, то работает:
@media screen and (max-width: 420px) and (orientation:landscape) { /*css for landscape*/ } @media screen and (max-width: 320px) and (orientation:portrait) { /*css for portrait*/ }
Когда тестирую, то работает:
@media screen and (max-width: 420px) { /*css for landscape*/ } @media screen and (min-width: 320px) { /*css for portrait*/ }
А этот вариант не работает:
@media screen and (max-width: 420px) { /*css for landscape*/ } @media screen and (min-width: 320px) { /*css for portrait*/ }
Подскажите, как лучше всего использовать min-width и min-width?
и есть ли зависимость между min-/max width и orientation?
Что-то у вас код одинаковый для примера, что работает и нет :)
В последней работе мы использовали только такое(айпад):
т.е. максимальная ширина разрешения девайса 1024, с ориентацией не замарачивались.
>и есть ли зависимость между min-/max width и orientation?
Тут надо в самом деле тестировать и пробовать.
Если разберетесь, напишите плиз топик на эту тему, самому интересно!
Я сейчас исключительно iPhone для тестирую, так что не учитываю 1024.
Хочу действительно поправить — в 3ем примере имела в виду max-width для 320 (по идее должен работать… но не хочет =)
Попробуйте запись как у меня в примере выше. Значения максимальной ширины можно подставить любые. Проверяли, все работает.