28 апреля 2014 в 22:38
Доброго времени суток.
Суть вопроса такова: в кастомной теме на седьмой друпал реализована адаптивная верстка через медиа запросы. При изменении ширины окна браузера все элементы нормально ресайзятся. Но при использовании эмулятора мобильного устройства, либо через просмотр непосредственно с мобильного устройства ширина сайта фиксирована. Как бороться с данным явлением?
Комментарии
Из своего маленького опыта
Эмулятор не всегда подхватывает стиль - это зависит от эмулятора а также от того как вы цепляете стиль, через файл template, через свой модуль и т.д и т.п. возможно по этой же причине и глюки с мобильным браузером, по пробуйте перецепить стили по другой схеме (по другому).
ну или некорректно написан медиа запрос..(не все его правильно читают)
попробуйте на этом сервисе проверить..
p.s. Я часто использую модуль CSS Injector он цепляет любой стиль к теме до кишков, но так же у меня есть модуль (мобильный эмулятор) так вот он не видит стили через инжектор, только потому что он раньше инжектора снимает инфу о стилях (раньше чем инжектор их добавляет)
Эмуляторы(любые) - отстой. Кроме того, не забывайте, что на мобильные устройства существует такое же множество браузеров, как и на настольные версии, при этом они так же все работают немного по разному. К примеру, возьмем iPad - правильное отображение в Safari, не гарантирует правильное отображение в Chrome, даже не смотря на то, что оба они на движке webkit и запускаются на одном и том же устройстве, правда тут чаще проблемы с JS, а вот с оперой, которую любят юзать на андроиде, могут быть и с CSS.
На самом деле, сейчас единственный способ проверить как отображается на устройстве страница - это зайти с нужного устройства. В идеале, для удобства, по мимо самих планшетов(разных типов) и смартфонов, нужно так же иметь собственный домашний DNS сервер(если хотите заходить на локальный сервер с мобильных устройств, иначе придется юзать хостинг) и какой-нибудь мак для отладки всякой iФигни.