У меня есть контейнер, которому прописаны следущие свойства:

Question

У меня есть контейнер, которому прописаны следущие свойства:

width: 360px;
padding-left: 30px;
padding-right: 30px;

Дочерним элементам назначается ширина 100%, что из-за паддинга родителя ест-но приводит к ширине 300px.

Но поставить в iPhone режим экрана в "увеличенный режим" (Zoomed view) , контейнер выходит за пределы экрана (в мобильных устройствах). Наверное можно отключить зум, через прописав в index.html:
<meta name="viewport" content="width=device-width, user-scalable=no" />

Но как решить эту проблему БЕЗ отключения зума? Может есть какой-нибудь псевдо-css-селектор для увеличенного режима в сафари? Как задать правильно 360px, и что бы это не ломало вёрстку в увеличенном режиме?

#css #frontend #html #programming #russian

0

30.08.2021

7 ответов

11 просмотров

Daniil 👾 Simushkin

обычно, если пользователь у себя в браузере/системе врубает зум и что-то ломается - это проблема пользователя)

0

30.08.2021

A F Автор вопроса

Alibek Кulseitov 🇰🇿
Зачем ставишь зум?

Как фронтендер откуда мы можем знать зачем пользователи меняют настройки экрана телефона. Это даже не настройка браузера Сафари, а именно настройка телефона - вероятно это для людей, у которых проблемы с мелким шрифтом (это моё предположение)

0

30.08.2021

A F Автор вопроса

Daniil 👾 Simushkin
обычно, если пользователь у себя в браузере/систем...

Я не согласен, разработчики тех же мобильных приложений обязаны учитывать другие режимы, если таковые существует. Мне кажется это хороший тон. Ладно так можем уйти в философию, мне бы практику: кто сталкивался и как решал.

0

30.08.2021

Daniil 👾 Simushkin

A F
Я не согласен, разработчики тех же мобильных прило...

но сайт !== мобильное приложение

0

30.08.2021

A F Автор вопроса

Daniil 👾 Simushkin
но сайт !== мобильное приложение

А мы, веб-фронтендеры чем хуже? 😁

0

30.08.2021