Layout izquierda, centro y derecha...

[alex28]

Tengo un problema con un layout, tengo un div de dimensión fija de 750 px, y dentro de ese div tengo otros tres div, los 3 tienen float a la izquierda, y quedan horizontalmente alineados:

.___________________________
|.............|..............|.............|
|.............|..............|.............|
|..DIV 1....|...DIV 2...|...DIV 3...|
|.............|..............|.............|
|.............|..............|.............|
.-------------------------------

quisiera que el div 2 se expandiera 100% si el div 3 falta, ya que el div 1 y 3 deberían tener dimensiones fijas..pero el div 2 no, el div 2 se debería ajustar al espacio restante, pero si le pongo al div 2 un width de 100% entonces me corre el DIV 3 hacia abajo.
Me podrían ayudar con el Layout en CSS? y si no entienden pregúntenme, gracias.

::alex::

[eljose]

Existe una manera de hacer 3 columnas como tu quieres, aquí hay un buen tutorial:

Tres columnas en desarrollo web
Aquí te dice cómo hacerlo fluido también.

Tres columnas en desarrollo web (Otra manera)

Un saludo

[alex28]

Ok, muchas gracias, pero en ese diseño las 3 columnas tienen un width... osea que si quitas la de la derecha la del medio no se reajustará al espacio vacío, no sé si me entiendo... de todas maneras...gracias por el buen recurso que me diste!

::alex::

[Jesusguevarautomotri]

Aqui hay otros links que espero te ayuden.

Iniciado por mbavio

En Internet hay millones de recursos para aprender a hacer layouts a dos o tres columnas.

http://blog.html.it/layoutgala/ (ya hechos)

http://css.maxdesign.com.au/floatutorial/ (los ultimos dos tutoriales enseñan esto)

Espero que te sirvan. Saludos

[eljose]

En los enlaces de Jesusguevarautomotri tampoco lo soluciona. (los cuales, por cierto, son muy buenos)

Parece que lo que tu quieres hacer sólo se puede hacer de esta manera mas o menos:

En caso de que esté la tercera columna:

#principal{
margin-left: 170px;
background-color: #ffffff;
padding: 4 4 4 4px;
margin-right: 130px;
}

En caso de que no esté

#principal_alt{
margin-left: 170px;
background-color: #ffffff;
padding: 4 4 4 4px;
width: 100%;
}

Y cambiar el nombre del div en el html. Ya se que es una solucion poco elegante. Pero si la página es php no te costará demasiado y si vas a modificarlas a mano no te cuesta nada cambiarlo.

[softimus]

Hola:

Cuando el div 2 crece, inevitablemente empuja hacia abajo el div 3 porque no hay nada que lo contenga.

¿Intentaste utilizar una tabla de 3 columnas y darle el ancho al TD?

por ejemp:

<table id="table" cellSpacing="0" cellPadding="0" width="750px" border=1>
<tr>
<td width="10%"><div>contenido1</div></td>
<td width="100%"><div>contenido2</div></td>
<td width="10%"><div>contenido3</div></td>
</tr>
</table>