Osea, basicamente, lo que vos queres hacer es meter tres divs en fila dentro de contenido. Bien.
Código HTML:
<div id="todo">
<div id="header">
Un par de divs aca
</div>
<div id="contenido">
Aca el problema
</div>
</div> En este caso, debes definir el ancho de contenido. Por ejemplo, 100%;
Código:
#contenido {
width:100%,
}
Ahora que tenes el contenido, le metes los tres DIVs
Código HTML:
<div id="todo">
<div id="header">
Un par de divs aca
</div>
<div id="contenido">
<div class="cajon" id="cajon-1">
Contenido Cajon 1
</div>
<div class="cajon" id="cajon-2">
Contenido Cajon 2
</div>
<div class="cajon" id="cajon-3">
Contenido Cajon 3
</div>
</div>
</div> Ahora, el CSS quedaria algo asi:
Código:
#contenido {
width:100%,
}
#contenido div.cajon {
width:30%;
float:left;
}
Entonces con esto, te quedarian tres cajitas dentro del contenido.
Luego, si necesitas agregarle padding a las cajas, acordate de restarle el padding al ancho del DIV, para evitar problemas con desbordes.
Saludos y espero que ayude!