Ширина страницы iPad iPad - PullRequest
3 голосов
/ 05 мая 2011

У меня есть некоторые проблемы с моей страницей и заголовком на iPad против рабочего стола.

Когда вы смотрите на http://www.photopile.me на компьютере, изображения и колонтитулы должны растягиваться на 100%пути к краю.enter image description here

Когда вы переходите к нему на iPad, он не показывает всю ширину страницы и размер 100% заголовка изменяется.Я бы хотел, чтобы ipad показывал всю ширину страницы.enter image description here

Я только начинаю оптимизировать под iPad, но чего мне не хватает?Я уверен, что есть маленькое глупое правило, которое я пропускаю.Вот заголовок HTML

<header>
    <div id="header-wrapper">
        ... header content ...
    </div>
</header>
<div id="page-content">
        .... photos ....
</div>

и CSS

header {
    background: url('../images/header-bg.jpg') repeat-x top left;
    z-index: 500;
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .9);
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .9);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .9);
    position: fixed;
    top: 0;
    width: 100%;
}
#header-wrapper {
    padding: 10px;
    position: relative;
}
#page-content {
    margin: 0 auto;
    z-index: 400;
    position: relative;
    margin-top: 91px;
    overflow: hidden;
}

Надеюсь, хватит информации!

Ответы [ 2 ]

13 голосов
/ 07 октября 2011

Вы можете заглянуть в элемент управления масштабированием через метатеги.У меня были некоторые проблемы с этим недавно, когда iPad увеличивал мою страницу, и я не осознавал этого.(что привело к непреднамеренному развитию с неправильным размером)

<meta name="viewport" content="initial-scale=1">

Возможные значения:

  • initial-scale
  • max-scale
  • min-scale
  • user-scalable
  • width
  • height

Подробнее об этом можно прочитать здесь: http://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html

3 голосов
/ 05 мая 2011

@ brenden,

напишите min-width:1024px; вместо min-width:1180px; в #wrapper, потому что это проблема вашего ПК.Проверь себя.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...