Проблемы с сайтом CSS на iPad

Очень странная вещь происходит в браузере Safari на iPad2.

Следующая страница (домашняя страница) отсекает крайнюю правую верхнюю навигационную ссылку. Там должно быть написано «Запросить цену», но обрывается на «Запрос».

Кроме того, размер страницы не изменяется автоматически, чтобы соответствовать размеру экрана iPad, как обычно.

URL сайта: www.skiplan.co.uk

Я пытался использовать метатег области просмотра, но это только ухудшило ситуацию.

Любые идеи? Я просто не вижу никаких проблем в firebug.

Примечание: дрянные онлайн-эмуляторы iPad показывают это нормально — это происходит на реальном/физическом iPad2.


ipad css meta-tags viewport
person user991830    schedule 05.02.2012    source источник
comment
эта проблема не связана с ipad, вы также получаете это поведение, когда вы делаете ширину окна браузера достаточно маленькой   -  person Felix    schedule 05.02.2012

Ответы (2)


arrow_upward
3
arrow_downward

Окно просмотра iPad действует так, как будто оно имеет ширину 960 пикселей, поэтому ваш сайт больше, чем его экран. Метатег области просмотра необходим для правильного масштабирования, хотя вам, возможно, придется немного поэкспериментировать, чтобы сделать это правильно.

Другой альтернативой является использование медиа-запросов для разработки уменьшенной версии для небольших экранов.

Я бы посоветовал всегда иметь версию с разрешением 960 пикселей — ширина 1020 пикселей не является популярной по какой-то причине!

person Rich Bradshaw    schedule 05.02.2012
comment
У меня есть этот метатег в моем html-файле ‹meta name=viewport content=width=device-width; начальная шкала = 1,0 />. Все еще не решил мою проблему. Я свяжусь с вами, когда попытаюсь установить его на 960 пикселей. - person AJ Naidas; 20.02.2012

arrow_upward
0
arrow_downward

Скорее всего, вы используете стили CSS, такие как проценты, которые позже нарушают ваш дизайн на iPad, поскольку он адаптируется к контейнеру размера дисплея (максимальные размеры).

Чаще всего я вижу это, когда люди определяют блок/контейнер в px, а шрифт/и т.д. в %' orem`.

person Jakub    schedule 05.02.2012
comment
Я не использовал проценты на своем сайте. На самом деле, в моем первом макете imageworkz.asia/TheHatLab2 высота использовалась в процентах, и это действительно работало. лучше. - person AJ Naidas; 20.02.2012