Box div doesn't expand to 100% width, but to width of an inner div child

I seem to have the following CSS issue only in Firefox 3.0, Firefox 3.6. With newer versions of Firefox, like 3.6.6 for example, my layout works fine.

Unfortunatelly, I can't upload a full screenshot. Here is the code:

#header { width:100%; }
#header div.container { width:980px; margin:0 auto; }
#presentation { width:100%; background:red; }
#presentation div.bg { background-image:url(../images/img.png) no-repeat center top; }
#presentation div.container { width:980px; margin:0 auto; }

<div id="presentation">
<div class="bg">
<div class="container">
[content here]
</div><!-- end .container -->
</div><!-- end .bg -->
</div><!-- end #presentation -->

FF3.0 cuts my background image found in div.bg to the width of div.container, altought its parent div, #pres开发者_Go百科entation is set at 100% and only its children div has the width of 980px. (no logical reason why my background image is set to 980px)

This seems to be only in FF. Chrome, IE, etc. displays my background image with no problem and it doesn't cut anything.

I've tried: width:100%, height:100%, min-width, min-height to both the #presentation div, #presentation div.bg, overflow:hidden, html > #presentation, clearing div after #presentation or it's inner children.

Mostly everything I could find on the Internet so far.

My HTML document validates with XHTML Strict mostly, except a few errors that I'm required to make (a div inside a UL) - errors that aren't inside the #presentation div.

I think it might be due to the repeating of the bg image

this is what it should be like by the way:

#presentation div.bg { width: 980px; background:url("img.jpg") no-repeat top center; }

Maybe the background is not big enough and leaves some empty space?

Depending on what kinda of bg image you have, you might want to use repeat-x instead of no-repeat

By the way.. Its a good thing to have width and height attributes for the divs with css background images, or at least width if not heigh. In some cases making the browser window smaller than the wrapper may cause cutting of the background image if theres no set width though that shouldnt be the case here.