Probléme de css

body
{
   width: 936px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour 

voir ! */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */
}


#header{
border:1px solid #FF9900;
height:198px;
}

#menu1
{
  float:left;	
   width: 234px;
   height: 369px;
   overflow:hidden
}


#menu2
{
   float:left;
   top: 198px;
  
   width: 234px;
   height: 369px;
   overflow:hidden
}

#frame
{
float:left;
   
   overflow:auto;
   width:468px;
   height: 369px;
}

#pied
{
border:1px solid #FF9900;
   
   height: 198px;
   overflow:hidden
}

<div id="header">
haut
   <!-- Ici on mettra le menu de gauche 234*369 -->
</div>


<div id="menu1">
GGGG
   <!-- Ici on mettra le menu de gauche 234*369 -->
</div>



<div id="frame">
   <!-- Ici la frame qui fait 468*369 -->
   <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam lacinia leo ac nunc. Nulla aliquet. 

Nullam quam leo, volutpat vitae, venenatis eget, blandit eu, augue. Proin ac libero nec magna laoreet 

tempus. Nullam felis. Nam et libero. Sed velit dui, tempus in, nonummy venenatis, accumsan id, justo. Ut 

ullamcorper. Cras sem diam, vulputate nec, tempor at, pretium at, magna. Pellentesque habitant morbi 

tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur sapien pede, malesuada ac, 

ultricies in, dignissim eget, mauris. Nullam varius diam ac ligula. Morbi mattis posuere odio. Ut mattis risus ac 

erat. Nam volutpat, nisl vitae venenatis mollis, ante erat tincidunt purus, nec ornare felis tellus sed purus. 

Phasellus orci.</p>
</div>

<div id="menu2">DDD
   <!-- Ici on mettra le menu de droite 234*369 -->
</div> 

<div id="pied">
pied
   <!-- Ici je mais le pied 936*198 -->
</div>