Skip to content Skip to sidebar Skip to footer

Make Vertical Menu Height Fit 100%

I did a sketch http://i.imgur.com/cx3jXPu.jpg so sidebar has to drag down all the way together with the content sidebar.

Solution 1:

its height should be 100% as well as all of its parents divs

html, body{
    height:100%;
    width: 100%;
}
.container{
    width:100%;
    height:100%;
    border:1px solid red;
}
.sidebar{
    width:25%;
    height:100%;
    background:gray;
}

http://jsfiddle.net/ahmedskaya/Bek9L/1863/

Solution 2:

Using a jquery you can achieve it easily.

$(document).ready(function(){
    $("#side").height( $("#main").height() );
});

Here is CSS also.

#side{background: gold;}
#side, #main{float:left; width:200px;}

Here is the Demo.

Post a Comment for "Make Vertical Menu Height Fit 100%"