2015-11-25 3 views
1

У меня есть фиксированная панель навигации, длина которой зависит от моего веб-сайта, но сейчас она имеет собственную полосу прокрутки, поэтому, когда я просматриваю тело веб-сайта, навигационная панель статична , и будет прокручиваться только в том случае, если я физически прокручиваю навигационную панель.CSS HTML make div прокрутка до высоты содержимого

Это только результат «положения: исправлено»; или я что-то пропустил в своем CSS?

body { 
    margin: 0; 
    padding: 0; 
    color: #555; 
    font: normal 1.3em Arial,Helvetica,sans-serif; 
    background-color: #FAFAF0; 
    font-family: "proxima-nova",sans-serif; 
    display: block; 
} 
/*NAVBAR*/ 
    #sidebar-wrapper { 
     position: fixed; 
     background: #2C4649; 
     z-index: 1000; 
     left: 0px; 
     height: 100%; 
     margin-left: 0px; 
     border: none; 
     display: block; 
     -moz-border-radius: 0; 
     -o-border-radius: 0; 
     -webkit-border-radius: 0; 
     border-radius: 0; 
     overflow-y: auto; 
     overflow-x: hidden; 
     -moz-transition: all 0.5s ease; 
     -o-transition: all 0.5s ease; 
     -webkit-transition: all 0.5s ease; 
     transition: all 0.5s ease; 
    } 
/*PAGE CONTENT TO THE RIGHT OF NAVBAR*/ 
#page-content-wrapper { 
    margin-top: 20px; 
    overflow: hidden; 
    margin-left: 130px; 
    -moz-transition: all 0.5s ease; 
    -o-transition: all 0.5s ease; 
    -webkit-transition: all 0.5s ease; 
    transition: all 0.5s ease; 
    overflow-y: auto; 
} 

Кто-нибудь знает, как это исправить, так что полная высота сайта зависит от любого содержания NavBar или содержания страницы - а не отдельные прокрутка пунктов?

Благодаря

+0

Не могли бы вы сделать jsfiddle/code snippet/codepen? – www139

+0

Фиксированные элементы позиции фиксированы относительно окна просмотра, поэтому прокрутка полосы прокрутки окна не повлияет на нее. – j08691

+0

Вот jsFiddle моего содержания https://jsfiddle.net/krzuz842/1/ У Navbar есть независимый свиток к телу, я хочу, чтобы вы могли прокручивать по телу и видеть полный навигатор, если в этом есть смысл – gsusonline

ответ

0

Не совсем уверен, что вы после этого, но вот пример fiddle.

Все, что я сделал, это правило: #sidebar-wrapper{overflow-y:hidden;}, которое удалит любую полосу прокрутки в фиксированном элементе. Это означает, что если на навигационной панели слишком много контента, то будет отключено, а не visisble (отсюда «скрыто»). Если у вас уже есть полоса прокрутки в фиксированной навигационной панели, это означает, что у вас слишком много контента, поэтому это может быть не лучшим решением для вас.

Затем я добавил фиксированную ширину боковой панели в соответствии с смещением поля вашего контента.

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