Maquetacion a 2 columnas con DIV's

thisisalexis · #1 (**permalink**) 25/07/2006, 09:29

Que tal.

Se que esto lo deben haber preguntado y respondido ya cientos de veces en estos foros, pero tengo rato navegando para ver si encuentro lo que estoy buscando y aún no encuentro nada:

Solo quiero hacer una maquetacion a dos columnas con DIV's, que abarque el 100% de la pantalla, pero que la columna de la izquierda (menu) tenga un tamaño estático, por ejemplo, 160px, mientras que el tamano de la otra si sea relativo.

Intente hacerlo colocando 160px a la columna izquierda y luego 100% a la columna derecha, pero no me funcionó en Firefox.

Agradezco sus respuestas.

fer10 · #2 (**permalink**) 25/07/2006, 09:38

height:100% no funciona en firefox.. (o de menos a mi nunca me ha funcionado) lo que se tiene que hacer es agrandarla con tel contenido que vas generarndo..

safe · #3 (**permalink**) 26/07/2006, 12:14

Te dejo un pequeño ejemplo

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Testing...</title>
<style type="text/css">
<!--
#izquierda { float:left; width:160px; background-color: #CCC; }
#derecha { margin-left: 170px; background-color:#999; }
-->
</style>
</head>
<body>
	<div id="izquierda">Columna Izquierda</div>
	<div id="derecha">Columna Derecha</div>
</body>
</html>

heavy metal · #4 (**permalink**) 02/08/2006, 14:45

si al ejemplo de "safe" le quitas solo el "float:left;" no cambia en nada no? si la columna derecha pasara a la dercha igual porque su margin-left es mas grande que el ancho de la columna izq, entonces float:left no sirve de nada creo;chau

GoRaK · #5 (**permalink**) 02/08/2006, 16:06

Cita:

Iniciado por heavy metal

si al ejemplo de "safe" le quitas solo el "float:left;" no cambia en nada no? si la columna derecha pasara a la dercha igual porque su margin-left es mas grande que el ancho de la columna izq, entonces float:left no sirve de nada creo;chau

No se puede quitar el float:left; porque sino el bloque de la derecha se pone en la derecha pero con un salto de linea y por tanto no estan a la misma altura.