widths not taking up 100% of parent and 'stick out' too

Hello all this is my 1st CSS based design. Had a few problems.
Most of problems happen in Firefox 1.5 which is unexpected. (file is attached)
have some divs on top of each other contained in a centered main container div (centered with float:left/text-align:center 'fix')... one of the sub divs is fixed width (Logistics div), and another (Participants div) has an intrinsic minimum width and the main div area therefore shouldnt go passed these sub-divs box. yet it does in FireFox, especially when browser is made smaller.

what i would like to happen is...
1. green divs dont stick out of main blue container in FireFox
2. main div(blue area), shouldnt go passed the minimum width needed for the subdivs(the logistics and participants subdivs), yeh it does (blue area goes more 'to te left' than it should) and makes the green areas stick out even more
3. IE seems to have a problem stretching the subdivs to the full 100% (for example make the browser window small, the green areas doesn't take up 100% of blue area anymore)

Thanx in advance,
File is attached. any help or knowledge or even links is appreciated. i am sure this stuff is not the kinda stuff thats easily googled :)

think i solved most of it playing around...
width:100% means parents width not 100% of parents width in FF, those boxes stick out ugly with that, now good.
Firefox likes width:auto;