background image and color wont fill, stretch div

[bitstomper]

Hi I am struggling with the following:
I am using a div with a background image. I have found I need to set the height of the div to show the background image.
I basically like the div to display a background image and a color behind it (via another parent div maybe) so that when the text in the child div is longer than the background image it fills with the background color. Similar to what we are used with using tables in the old days (where you set the table to have a background image and a td to have a different background image).

Here is some of the code:

<div id="maintable">
<div class="backgroundimage">
....some links....
<div class="spacer"></div> /to clear floats
<div id="container">
<div id="menu"> /styling of left floated menu
<div class="submenu"> /text styling of submenus
....menu....
</div>
</div>
<div id="maincontent"> / this is where the text sits
....text....
</div>
</div>
</div>
</div>

CSS:

.backgroundimage {
background: url(../images/backgrounds/backgrmain3.jpg) 0 0 no-repeat;
background-color:#FFFFFF;
width: 951px;
height: 900px;
}
#maintable {
    font-family: Arial, Helvetica, sans-serif;
background-color: #FFFFFF;
margin-left:auto;
margin-right: auto;
width: 951px;
}
div.spacer {
  clear: both;
  height: 0px;
 }
#container {
width: 951px;
text-align: left;
background-color: #FFFFFF;
}
#maincontent {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #333333;
padding-left: 30px;
padding-top: 80px;
width: 720px;
float:left;
}

As you can see I have added lots of background-color and even tried to add another div which encompasses the background-image div and set it to a white background.
However, I think without giving the divs a height the background-color does not work?
What am I doing wrong?

[SuzyUK]

Your "spacer" or clearing div is in the wrong place

because you need to stretch the background around all floated divs you need the clearing div to be the very last thing in the "backgroundimage" div in order to clear your left and main content divs (both of which are floated)

[bitstomper]

thanks you were right.
There were some divs which had floats:left inside the backgroundimage div. They still needed to be cleared before other divs with floats. So I changed the clearing div to clear: left and now all is fine.

Thanks again!