Los nombres de los div no son los mismos en el html y el css, en cualquier caso prueba esto.
Código:
#cuerpo {
float: left;
width: 100%;
margin-right: auto;
margin-left: auto;
background: #0099FF;
}
#cuerpo #derecha {
background: #CC0000;
float: right;
width: 25%;
}
#cuerpo #lateral {
float: left;
width: 25%;
background: #CC6600;
}
#cuerpo #principal {
background: #CCCCCC;
width: 49.9%;
float: left;
}
.pie {
background: #003399;
padding-top: 5px;
padding-bottom: 5px;
float: left;
width: 100%;
}
html>body #cuerpo #principal {
background: #CCCCCC;
width: 50%;
float: left;
}
Código:
<div id="cuerpo">
<div id="lateral">
<p>Lateral</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
<div id="derecha">
<p>derecho</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
<div id="principal">
<p>principal</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
</div>
<div class="pie"></div>