100% высота в мобильном браузере с использованием CSS ⇐ CSS

[Anonymous]

Я работаю над своим веб-сайтом и хочу, чтобы на мобильных устройствах он выглядел очень просто: по сути, там всего три раздела, каждый из которых должен соответствовать ширине и высоте окна

Код: Выделить всё

Он отлично выглядит в браузере моего компьютера в режиме устройства, но когда я открываю его на своем мобильном телефоне (iPhone), возникает проблема с строкой URL-адреса, которая уменьшается по мере сдвига вниз. При загрузке страницы минимальная высота адаптируется к высоте браузера, включая панель, и не меняется, когда панель меняет свой размер. Так что он больше не подходит к экрану. Я попробовал это:

Код: Выделить всё

Но очевидно, что разделы слишком высокие. Вероятно, я мог бы найти обходной путь в jQuery, но я бы не хотел. Надеюсь, в CSS есть несколько простых решений.
Спасибо, что уделили время.

Подробнее здесь: https://stackoverflow.com/questions/296 ... -using-css