Click to See Complete Forum and Search --> : expanding background


jinxie
10-20-2009, 10:37 AM
I'm building a website with a few pages, and having a problem getting the background to expand with the divs.
Written in html and css. I don't know javascript but I'm trying to learn.
The body background is a repeated texture.
The website is contained in a box div with a solid color background.
The text content div is another solid color background, smaller than the containg box, and expands and contracts vertically.
On the longest page the containing box is visible for 20px all the way around the content div. Looks fine. The problem is that on a different page with only half as much content the containing box doesn't resize with the content div. It ends up with a huge block of the box color at the bottom of the page which makes things look unfinished.

Is there some way to get the main containing div to expand and contract vertically in sync with the content divs?

mordauk
10-20-2009, 01:20 PM
It would help if you could provide your html and css code.

But, the following code should do what you want.


<div id="container">

<div id="text">
<p>this is the text</p>
</div>

<div class="clear"></div>

</div>



#container {
height: auto;
width: 800px;
padding: 20px;
}
#text {
padding: 10px;
}
.clear {
clear: both;
}


The div class clear will cause the container box to always expand with the text box.

jinxie
10-21-2009, 11:08 AM
Thanks very much. The div class clear was what I was missing. Everything is good now :)