CSS: iPhone / iPad Safari добавляет дополнительные поля или отступает вокруг элементов?

Question

Сайт, над которым я сейчас работаю (roemlunchdinner.nl), выглядит хорошо во всех основных браузерах, но Safari на iPhone и iPad, кажется, добавляет дополнительные поля или отступает вокруг элементов в нижней части страницы. Я попытался установить поля и отступы на ноль для всех соответствующих элементов, установить конкретные ширины и т. Д., Но безрезультатно. Я не могу воспроизвести это любой другой браузер. Кто-нибудь здесь имеет представление о том, что здесь происходит?

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

Скриншот Windows Safari

Скриншот Safari для iPad

Answer 1

Mobile Safari изменяет размеры элементов, основываясь на своем лучшем предположении о том, что будет читаться для пользователя.

Вы можете изменить это поведение на всем сайте, выполнив это в своем CSS:

body { -webkit-text-size-adjust: none; }

или вы можете выбрать только отдельные элементы.

Answer 2

попробуйте использовать медиа-запросы для ipad @media только экран и (ширина устройства: 768 пикселей) { твой css ... }

дай разную ширину и посмотри. Надеюсь, это поможет