Как писать стили под все типы устройств (по высоте)?

Question

[stanislavkm]

Как корректно писать стили для всех типов устройств.
Использовал условно

@media (max-width: 760px) {
...
}

ширина - ок, но при изменении высоты всё выглядит по разному. как этого можно избежать?

Comments

[alexalexes]

Приведите пример, где у вас проблемы с высотой.

[stanislavkm]

alexalexes, к примеру есть два мобильных устройства с одной шириной, но абсолютно разной высотой. контент ведь будет выглядеть по разному (условно, на одном блок текста будет на 30% от экрана, на другом на 90)

[Александр Цымбал]

stanislavkm, это нормально. Но вообще можете попросвещаться на тему единицы измерения vh и привязать размер шрифта, например, к высоте окна браузера. Но это плохо. Но как почва для идей сойдёт. Лучше высоту блока привязать к высоте окна браузера, а текст в нем центрировать по вертикали.

[alexalexes]

Ну, пусть текст будет в 10 раз больше высоты области просмотра - это не проблема. Вниз листать легче, чем влево-вправо, поэтому все медиазапросы направлены на то, чтобы главный блок контента притянуть к ширине области просмотра.

[Ankhena]

stanislavkm,

к примеру есть два мобильных устройства с одной шириной, но абсолютно разной высотой. контент ведь будет выглядеть по разному (условно, на одном блок текста будет на 30% от экрана, на другом на 90)

Черт с ней с версткой.
Нарисуйте, пожалуйста, два макета, оба с шириной 360, один с высотой 400, другой 700 (высоту можете выбрать на ваш вкус). И сделайте так, чтобы выглядело одинаково.

Answer 1

[Лев Салатов]

Может быть здесь найдете ответы.