Como hace una capa al lado de otra

[corretodo]

Tengo 3 capas una grande de 560px y otra dos iguales de 265px.
Dentro de la grande han de estar las dos pequeñas una al lado derecho y la otra al lado izquierdo.
Es para hacer dos columnas de texto y fotos dentro de la capa grande, separadas por una linea vertical.
No puedo utilizar el float: left; o float: right; porque se me rompe toda la estructura y tampoco posiciones absolutas los textos van a ser de distinta longitud.
Hay alguna forma de hacerlo en css.
---------------------
Son estas:

Código PHP:

  #centro { 
width : 560px; 
border:#000 solid 1px;
} 
#izquierda { 
width: 265px; 
border:#FC0 solid 1px;
}
#derecha { 
width: 265px; 
border:#FC0 solid 1px;
} 
   

Código PHP:

  <div id="centro">
 
<div id="izquierda">
............
...........
..........
</div>
<!-- Aqui ira la linea vertical que no se en css como hacerla -->
<div id="derecha">
............
...........
..........
</div>
 
</div> 
   

[juanito1712]

En la parte html tendrias que poner primero la capa derecha y luego la izquierda y en el css flotarlos como corresponda si pones la izquierda primero y luego la derecha se marea todo el asunto.

<div class="derecha">

</div>

<div class="izquierda">

</div>

.derecha{
float:right;
}

.izquierda{
float:left;
}


se me olvidaba seguramente al flotar las capas hijas de centro te de la impresion que se salen de ella y si, es asi, para ver lo que te digo flota las dos capas que quieres y a centro aplicale un borde y veras por donde pasa, para solucionar esto deberas aplicarle este estilo a centro

.centro{
clear:both;
}

y la linjea vertical la podrias hacer con alco como

.derecha{
border-left:#ffffff solid 1px;
}

o añadir una capa central si lo quieres mas bonito pero recuerda que en la partehtml tendrias que poner derecha izquierda central, y no izquierda central derecha como pareceria logico

[corretodo]

Muchas gracias me ha funcionado muy bien.
Tengo otra duda y si no te importa a ver si me la puedes aclarar como esta.

Es otro caso en el que tengo 3 capas para dividir en 3 columnas
izquerda centro y derecha.
No es igual al de antes.

A veces me falla, se montan y no se la causa es esta.

Código PHP:

  #izquierda { 
width: 197px; 
padding: 0 0 0 8px; 
float: left;
}
#centro { 
width : 560px; 
padding: 0 0 0 8px; 
float: left;
} 
#derecha { 
width: 197px; 
padding: 0 8px 0 0; 
float: right;
} 
   

Las llamo asi

<div id="izquierda">
............
...........
..........
</div>

<div id="centro">
............
...........
..........
</div>

<div id="derecha">
............
...........
..........
</div>

Que puedo tener mal.
Me debe faltar algo en el css.

[carscx]

¿Es posible que esas 3 capas esten dentro de otra más grande?

[corretodo]

Si efectivamente esas tres capas estan dentro de otra mas grande que las contiene.
Esa capa tiene una dimension de 995px.

[carscx]

Cuando dices a veces me falla. ¿Te refieres a cuando lo ves en IE o en Firefox? Es muy posible que lo veas en Firefox bien, y en IE mal, las capas flotantes no suelen funcionar bien en IE. Al menos hasta la version 7. El CSS que tienes deberia funcionar correctamente. Si no es así, comprueba si algun elemento que tengas dentro de las cajas, o fuera, esta provocando que estas se descoloquen.

Puede ser que tengas una imagen dentro de alguna caja, y esta tenga un margen.

Por otro lado, prueba a utilizar algun reset.css, hojas de estilos que te eliminan todo rastro de los valores por defecto de los navegadores, así generalmente, suele ser mucho más limpio el diseño.

Un saludo,

[corretodo]

Muchas gracias por vuestras ayudas.