Сделать div идти полностью вниз

Я работаю над проектом веб-дизайна для одного из моих классов. Я не могу понять, как сделать дивы идти вниз всю страницу (цвет)Сделать div идти полностью вниз

http://jsfiddle.net/vmm1s4Lt/
http://codepen.io/bmxatvman14/pen/fihwD

Выдержка:

nav { 
    background: black; 
    color: white; 
    float:left; 
    width:20%; 
    height:800px; 
    display:inline-block; 
    /*margin-top: 40px;*/ 
    padding-bottom: 40px; 
    position: relative; 
    z-index: 10;  
} 

#main { 
    background-color:#04cfe1; 
    float:right; 
    width:80%; 
    /*margin-right:10px;*/ 
}

Примечание: Я довольно умеренный кодировщик, поэтому я пробовали высоту: 100%, и это ничего не делало.

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

сайт Полная страница: http://rubergaming.com/project/

Благодаря тонну!

источник

2014-09-16 BMX_ATVMAN14

В дополнение к этому у вас есть какие-то другие проблемы в разметке ... например, быть в курсе, что вы не можете использовать один и тот же 'id' на несколько элементов (так должно быть только одно вхождение' идентификатора = "main" 'в вашем документе) –

Я рассмотрю это, спасибо! Я потратил около 3 часов на это, так что это была быстрая работа. –

Вы можете достичь этого, используя высоту 100%, но вы, возможно, забыли, что вы также должны дать элементы контейнера высоту 100% для того, чтобы это сработало, когда вы даете свой #main div, который составляет 100% высоты. Я также немного изменил некоторые из ваших других стилей, вам может потребоваться настроить по мере необходимости. http://jsfiddle.net/ngz6e5p1/.

/*Give containing elements, as well as our main div, a height of 100%*/ 
html, body, #wrapper, div#main { 
    height: 100%; 
} 

/*This is overriding styles you already had - I changed the nav's height from 800px to 100%, and removed padding which will cause there to be an extra white space under the main blue nav if present */ 
nav { 
    height: 100%; 
    padding-top: 0px; 
    padding-bottom:0px; 
}

источник

2014-09-16 01:08:00

Спасибо, чувак! У меня есть еще один вопрос: я пытаюсь получить весь текст основной части, а что нет, что идет по ширине, единственный способ, которым я пытался, он берет цвет фона с ним:/ http: // grab.by/AnIE <- Все это –

Что вы подразумеваете для черной полосы, чтобы пройти весь путь? А чтобы охватить синий DIV по всему остальной части страницы, попробуйте следующее:

<div id="main" style=" 
    position: absolute; 
    margin-left: 20%; 
    bottom: 0; 
    top: 0; 
"> 
    //ALL THE OTHER STRUFF INSIDE THIS DIV 
</div>

источник

2014-09-16 01:07:42

Сделать div идти полностью вниз

ответ

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