Css Question

Hi guys a bit of a dumb question probably.

I have my css layout with a header at the top and on the content with right sidebar and footer

With a white background for both the content and sidebar fields when I enter content both look to expand nicely and this looks great but when I put my background image in it doesn't seem to expand properly for example.

If I have say red bg colour in my content and green in my sidebar if I put my text in the main content bit the green bar doesn't expand down and get a white bit under the base of the green thing (white hence looks normal without colour).

What I want is for the bg colour of both boxes to expand down and for both boxes to be the same length no mater what the content of the other is.

(my code for example)

#sidebar-a {
float: right;
width: 240px;
line-height: 18px;
}

#sidebar-a .padding {
padding: 25px;
}


#content {
margin-right: 240px;
line-height: 18px;
}

#content .padding {
padding: 25px;
}


h1 {
margin: 0;
padding: 0;
float: right;
margin-top: 54px;
padding-right: 31px;

}

#content h2 {
margin: 0;
padding: 0;
padding-bottom: 15px;

}

#content p {
margin: 0;
padding: 0;
padding-bottom: 15px;

}

That isn't a dump question at all. It has been discussed a lot in here. Have a look here for one solution: http://alistapart.com/articles/fauxcolumns/
http://www.projectseven.com/tutorials/css/pvii_columns/index.htm

that is great but I am still trying to get my head around css and this is not sinking in at the moment. :(

Please provide a link to your site then.

You need to clear your floats. Since you didn't post the css for your footer we can only assume that its not absolutely positioned. Add clear:both to the CSS for your footer.

get it now I think, thanks :)

entered in error