Struggling with backgrounds

[donnysobonny]

Hey guys,

Please take a look at a basic site that I am putting together

mahesh.testsitedomain.eu

I am really struggling to get my head around how to make the left side menu section background color extend when the content in the right populates further than it's default height. You will see that there is a gap between the bottom of the left side menu, and the top of the footer.

i've tried a few different things but simply cannot work out how to do it.

Many thanks in advance for any help.

[Lerura]

In order to make height:100% active you need to set the height for body and html as well

html, body {height:100px;}

and you need to make #leftside position:absolute instead of position:relative;display:table;:

#leftside
{
    background: none repeat scroll 0 0 #31507A;
    position:absolute;
    height: 100%;
    width: 250px;
}

now that #leftside is invisible to #mainbody, you need to manually move #mainbody to the right equal to the width of #leftside:

#mainbody
{
    margin: 0;
    padding: 0 !important;
    position: relative;
    width: 1250px;
    margin-left:250px;
}

[donnysobonny]

Thanks for the response.

That's it all sorted now!