2014-07-23 4 views
0

У меня есть базовая панель под названием BasePanel, код которой не может быть изменен. У меня есть панель, которая всегда является фиксированной высотой, и эта панель НЕ добавляется в BasePanel, но она перекрывается с BasePanel. У меня также есть панель под названием Container, которая добавляется в BasePanel. Панельный контейнер должен находиться под баром.Как сделать полосу прокрутки не покрытой

Теперь, когда размер окна изменяется, панель Контейнер может автоматически появляться полосой прокрутки, которую я уже реализовал, но имеет проблемы. Проблема в том, что когда окно становится маленьким, часть полосы прокрутки будет покрыта. Я хотел бы знать, как я могу решить эту проблему?

BasePanel { 
    width: 100%; 
    height: 100%; 
    position:fixed; 
    font-family: 'Arimo'; 
} 


Bar{ 
    height: 41px; 
    width: 100%; 
    z-index: 9998; 
    position: fixed; 
    top: 0px; 
} 


.Container{ 
    width: 100%; 
    height: 95.570321151%; 
    top: 4.429678848%; 
    overflow: auto; 

} 

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

.Container{ 
    width: 100%; 
    height: 95.570321151%; 
    top: 41px; 
    overflow: auto; 

} 

Если установить верхний контейнер в качестве 41px, стрелка вниз полосы прокрутки будут покрыты, потому что нет достаточно места для этого.

Другими словами, я хотел бы знать, как я могу сделать контейнер контейнера всегда начиная с верхнего 41px и независимо от того, как изменяется размер окна, контейнер не будет переполняться из BasePanel, так что полоса прокрутки не будет покрываться (помните, что бара нет в BasePanel)?

enter image description here

+0

принять взгляд на '@ media' CSS запросов, чтобы сделать моделирование на основе размера окна http://css-tricks.com/ css-media-queries/ – Adjit

+0

Я проверяю медиа-запрос, но я не уверен, как они могут применяться к моему делу. Он обеспечивает, когда размер является некоторым значением или между некоторыми значениями, что-то произойдет. Моя проблема заключается в том, что размер окна становится небольшим, панель Контейнер переполняется, и часть полосы прокрутки будет покрыта. Не могли бы вы рассказать мне, как использовать средства массовой информации для решения этой проблемы? – diane

ответ

0

Я выяснить, как это сделать. Просто используйте функцию calc(), чтобы установить высоту панели контейнера.

Такие, как известково (100% - 41px)

:)

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