Как сделать адаптив под телефон с шириной 1024px?

Question

[Valek-web Zir]

У меня есть страница как её адаптировать под телефон с шириной экрана 1024px если есть мининоутбуки с такой шириной?

Answer 1

[Sagrana]

Как вариант: отлавливать не только ширину экрана, но и высоту. Или проверять на orientation (landscape или portrait), чтобы отличать экран телефона от экрана ноута. А вообще, у какого это телефона вьюпорт 1024px?

Comments

[Valek-web Zir]

Вот, это не единственный пример)

[Valek-web Zir]

Спасибо

[Sagrana]

Valek-web Zir, То, что у этого телефона такое разрешение экрана не значит, что разрешение браузера такое же.
Почитайте про viewport

А проверить реальное разрешение сайта в браузере можно например через это

Например для моего iphone 7 вот такие данные

[Valek-web Zir]

Sagrana, хорошо, спасибо большое!

Answer 2

[Сергей Зенькович]

Прописываешь ститли в медиа запросе, и такие стили будут отображаться на всех устройствах с шириной экрана 1024 :

@media (max-width: 1024px) {
    /*Ваши стили*/
}

Comments

[Valek-web Zir]

Спасибо!