probleme alignement div

salut a tous:

voila mon probleme:

j'ai deux block collé! de n1/ 600+ n2 /280 =880px
et un endessous de 880px

le probleme c'est que sous explorer c'est nikel, mais sous firefox le block n2 passe endessous!

html

<div id="bloccadre">
		<div class="banniere"> </div>
		<ul>
		<li><a href="#" accesskey="1">Menu 1</a></li>
		<li><a href="#" accesskey="2">Menu 2</a></li>
		<li><a href="#" accesskey="3">Menu 3</a></li>
		<li><a href="#" accesskey="4">Menu 4</a></li>
		<li><a href="#" accesskey="5">Menu 5</a></li>
		</ul>
 
 
		<div class="fondmenu1"></div>
		<div class="fondmenu2"></div>
 
		<div class="fondmenu3"></div>
                </div>
                </div>

css

/* corps */
 
 div#cadre {/* conteneur global et arrière-plan du titre du cadre */
    width: 900px;
    padding-top: 40px;
    background: url(entetetop.png) top center no-repeat;
    position: absolute;
    left: 50%; 
	margin-left: -450px;
    }
 
    div#bloccadre{/* arrière-plan bas et sur l'ensemble du cadre */
    background: url(entetebottom1.png) bottom center no-repeat;
    padding-bottom: 40px;
    }
 
 
	 .fondmenu1
	  {
	width: 600px;
    height: 80px;
    background-image: url("fondmenu1.png");
    text-align: left;
    border-top: 1px solid #252525;
	border-left: 1px solid black;
	margin-bottom: 1px;
	float: left;
	margin-left: 10px;
	}
 
	 .fondmenu2
	 {
 
	width: 280px;
    height: 80px;
    background-image: url("fondmenu2.png");
    text-align: left;
    border-top: 1px solid #252525;
	border-right: 1px solid black;
	margin-bottom: 1px;
	float: left;
	margin-right: 10px;
 
	}
 
 .fondmenu3
	 {
 
	width: 880px;
    height: 20px;
    background-image: url("fondmenu3.png");
    text-align: left;
	border-bottom: 1px solid black;
    border-top: 1px solid #252525;
	border-left: 1px solid black;
	border-right: 1px solid black;
	float: left;
	margin-left: 10px;
	}