Ошибка адаптивного окна просмотра изображения iPhone 6+ (несемантическая сетка)

Вот веб-сайт: http://ch3.elance.website/en/

Не могли бы вы помочь мне исправить адаптивные изображения на iPhone6? Какой CSS отсутствует? Является ли это ошибкой несемантической сетки только для адаптивного изображения iPhone 6+?

Когда я тестирую веб-сайт в любом другом окне просмотра, это хорошо. Когда мой брат запустил свой iPhone 6+, изображения не реагировали. Используя стек браузера, я подтвердил проблему.

Вот сайты, которые я обычно запускаю для тестирования области просмотра:

Вот три скриншота, которые мой брат прислал мне со своего iPhone 6, используя технику Power + Home Button. Если вы посещаете веб-сайт с помощью любого из вышеперечисленных инструментов просмотра, сайт выглядит так, как будто он работает отлично.

введите здесь описание изображениявведите здесь описание изображения введите здесь описание изображения


css responsive-design viewport iphone-6 960.gs
person Uncle Iroh    schedule 18.05.2015    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Это не iPhone 6 Plus… это мобильная вещь. Не похоже, что вы установили начальную шкалу окна просмотра в голове.

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

Попробуй это.

person Sean Stopnik    schedule 19.05.2015
comment
Хм, я добавил этот фрагмент в свой заголовок, но согласно снимку браузера никаких изменений. Отличное предложение... - person Uncle Iroh; 19.05.2015

arrow_upward
1
arrow_downward

Как предложил @SeanStopnik, вы должны добавить метатег в свой код html:

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

Тег viewport был изобретен Apple для iPhone.

Дополнительную информацию можно найти здесь.

person Loegic    schedule 26.05.2015