CSS - фиксированная боковая навигация должна прокручиваться / перемещаться, если не полностью видна

Question

У меня есть сайт с фиксированным заголовком и фиксированной боковой навигацией и прокруткой контента.

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

Есть ли способ обойти это?

Я сделал быстрый макет, чтобы проиллюстрировать.

http://jsfiddle.net/cr0wn3r/ycTXF/

Все нормально, пока вы не уменьшите свой браузер, а затем не увидите, что левый колпак уходит со днаэкран и нет возможности прокрутить его.

Answer 1

Используя медиазапросы, вы можете определить размер области просмотра, а затем соответствующим образом оформить боковую панель (возможно, разместив ее после всего содержимого, если высота области просмотра слишком мала).

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

Ключ в том, чтобы использовать медиазапросы для правильной обработки разных видов.

Answer 2

Вероятно, вам следует использовать медиазапросы, чтобы изменить стиль вашей фиксированной навигации для пользователей с небольшими экранами. Меньший размер шрифта, отступы, что угодно.

Есть отличная статья Криса Койера, объясняющая CSS Media Queries здесь http://css -tricks.com / 6731-css-media-query /

Answer 3

Я мог бы подумать о решении добавить

    overflow: scroll;

На вашу CCS (я сделал это на вашей скрипке). Это уродливо, но в противном случае ваши посетители должны покупать новые экраны ... Или, может быть, вы можете просто настроить размер шрифта?!