Простая страница начальной загрузки не реагирует на iPhone - PullRequest
Новая
       1

Простая страница начальной загрузки не реагирует на iPhone

81 голосов
/ 22 февраля 2012

Я скачал пример Twitter Bootstrap и создал с ним простой проект rails. Я скопировал CSS, где это необходимо, и он отображается нормально. Я также скопировал js, и все отлично работает на моем рабочем столе: он реорганизует страницу, когда я изменяю размер моего браузера. При использовании некоторых «адаптивных инструментов тестирования дизайна» с различными размерами он прекрасно работает.

У меня проблема с iPhone: он отображается как на рабочем столе.

Когда я пробую страницу примера Bootstrap Hero (с которой я начинал), она отлично работает на моем iPhone.

Что может пойти не так? Я почти не коснулся CSS, я просто добавил отступ в нижний колонтитул.

К вашему сведению, CSS, который я изменил, заключается в том, что я связываю свое приложение с application.css со следующим содержанием: 

/* Application stylesheet */

@import url(bootstrap.css);
@import url(bootstrap-responsive.css);

/* Body */
body {
    padding-top: 60px;
    padding-bottom: 40px;   
}   

/* Footer */
footer {
    padding: 20px 0;
}

Ответы [ 4 ]

175 голосов
/ 23 февраля 2012

Убедитесь, что вы добавили: 

<meta name="viewport" content="width=device-width, initial-scale=1.0">

к вашему <head>.

У меня была похожая проблема, и я по ошибке подумал, что это просто вопрос ширины области просмотра.

Обновление : ознакомьтесь с ответом @NicolasBADIA для получения более полной версии.

107 голосов
/ 12 апреля 2012

Код, предложенный frntk, не работает, когда вы поворачиваете устройство в альбомной ориентации, и решение, заданное virtualeyes, неверно, потому что вместо запятых используется точка с запятой. Вот правильный код: 

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

Источник: https://developer.mozilla.org/en/Mobile/Viewport_meta_tag

6 голосов
/ 16 июля 2016

Конечно, это очень маленький крайний случай, но стоит упомянуть.

Если вы используете переадресацию домена через своего провайдера DNS, ваш сайт может оказаться в фрейме iframe.Например, GoDaddy использует эту технику, если вы маскируете свой домен и переадресовываете.

2 голосов
/ 04 января 2016

Я застрял на этой проблеме в течение нескольких часов.

Не забудьте также разместить содержимое внутри <div class="container-fluid">...</div>

...