Адаптация страницы под мобильную версию chrome

03.09.2017, 20:41. Показов 1376. Ответов 0

Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам

В мобильных версиях chrome и yandex стили ведут себя по разному из-за того что chrome отбирает от высоты экрана устройства 56px под навигационную панель сверху.

А yandex-нет. Он игнорирует навигационную панель и расстягивает блок по всей высоте устройства.
В связи с этим возникла проблема в разработке.

Нужно под яндекс браузер и хром отдельно стили прописать.

Пример проблемы:

В случае с chrome используется следующее правило

CSS
1
2
3
.div {
   height: calc(100vh - 56px); 
}

такое правило растягивает на весь экран устройства в chrome.
*56px - это высота навигационной панели сверху браузера, но оно не подойдет для yandex браузера, т.к. внизу экрана останется пустой пробел высотой в эти 56px.

для yandex браузера, firefox, opera подойдет только такое правило

CSS
1
2
3
.div {
   height: 100vh; 
}

Использование css хаков не помогает
Как решить данную проблему?

Миниатюры

Адаптация страницы под мобильную версию chrome

IT_Exp

Эксперт

34794 / 4073 / 2104

Регистрация: 17.06.2006

Сообщений: 32,602

Блог

03.09.2017, 20:41

Ответы с готовыми решениями:

Адаптация таблиц под мобильную версию сайта
Здравствуйте! Подскажите, пожалуйста, можно ли реализовать следующую вещь: создать таблицу с фиксированной шириной и поместить в тег...

Не получается адаптировать сайт html под мобильную версию
не получается адаптировать сайт html под мобильную версию, ребят, кто может помочь, прошу, очень надо, уже кучу статей перерыл, ничего не...

Удалить с css мобильную версию
подскажите что с данного кода убрать чтобы удалить полностью мобильную версию сайта

Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.

BasicMan

Эксперт

29316 / 5623 / 2384

Регистрация: 17.02.2009

Сообщений: 30,364

Блог

03.09.2017, 20:41

Помогаю со студенческими работами здесь

верстать мобильную версию сайта
Делаю сайт, точнее подправляю шаблон, на сайте заказчика, именно надо подправить мобильную версию сайта, Так вот вопрос как мне сделать так...

Удалить с css мобильную версию
ребята помогите удалить вот с этого css http://codepen.io/anon/pen/ZYbbem.css полностью мобильную версию сайта

Как отключить мобильную версию сайта?
Есть тестовый сайт в разработке http://510294.psiurok.web.hosting-test.net. Подскажите как отключить мобильную версию сайта, чтобы была...

как сделать мобильную версию сайта
Здравствуйте. Можете рассказать и объяснить в чем отличие мобильных версий сайта от обычной из за чего они так компактно отображаются...

Как добавить фильтры в мобильную версию сайта
Как в эту часть мобильной версии моего сайта добавить виджеты (фильтра). Скажи те пожалуйста папку или название файла куда вообще ставить...

Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:

Новые блоги и статьи Все статьи Все блоги /
Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .	Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .
Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .

Наверх