Как заставить полосы прокрутки на полностью реагирующем сайте?

В настоящее время я помогаю другу с очень простым, отзывчивым 1-страничным сайтом, который можно посмотреть here.Как заставить полосы прокрутки на полностью реагирующем сайте?

Если вы перетащите окно своего браузера примерно на 450 пикселей в ширину или меньше, вы увидите, что макет изменится правильно. Однако, когда вы перетаскиваете вертикально, чтобы сделать страницу короче, содержимое посередине скрывается/закрывается.

Мне нужно, чтобы текст в середине всегда был видимым, даже если пользователю нужно прокручивать/прокручивать его, чтобы увидеть его. ПРИМЕЧАНИЕ: Это все тело, которое я бы хотел прокрутить, а не только содержимое div.

На этом изображении вы можете увидеть, что текст рассматривается, если видовой экран не очень высок:

enter image description here

На DIV, который содержит основное содержание, я попытался установить высоту и мин -высоте, а также с использованием !important безрезультатно.

Должно быть, что-то не хватает. Любая помощь приветствуется.

источник

2013-08-27 Matt Cashatt

Я бы подумал об использовании медиа-запроса для высоты видового экрана; рассмотрим [это] (например, http://stackoverflow.com/questions/11404744/media-queries-max-width-or-max-height). Кроме того, «стратегически»? –

Я также хотел бы отметить, что в Firefox 17 ESR содержимое перекрывает нижнюю панель, а не скрывается за ней; вы можете рассмотреть явные спецификации z-index в вашем CSS, чтобы предотвратить это. –

@ AaronMiller - Спасибо, теперь проблема z-index должна быть исправлена. –

Установите div с именем «content» в стиле: «overflow-y: scroll;»

<div id="content" style="overflow-y: scroll;"> 
<!-- content --> 
</div>

источник

2013-08-27 18:21:17

Я пробовал это на своем браузере Chrome, и он отлично работал, вы должны попробовать. –

body { 
overflow-y: scroll; 
}

Обновлено быть весь документ.

источник

2013-08-27 18:23:15 Blynn

Прошу прощения, я должен был быть более ясным. Я хочу, чтобы все тело прокручивалось, а не только содержимое div. Я отредактирую свой вопрос. –

обновленный мой ответ, пожалуйста, добавьте ниже или измените любой другой специфический для тела css. – Blynn

Спасибо за ваши усилия, но это не решает проблему поддержания постоянной высоты в окне содержимого. Если я использую ваше предложение, содержимое div все равно разрушается, когда я делаю окно короче. Мне нужно, чтобы этот контентный div поддерживал заданную «минимальную высоту», которая затем заставляла бы полосу прокрутки для окна браузера самостоятельно. –

Как заставить полосы прокрутки на полностью реагирующем сайте?

ответ

Смежные вопросы