Foros del web, para los que viven de bits

MonicaH · 02-ago-2006, 12:08

Hola,

Dentro del DIV class="GLOBAL"

Tengo los DIV IZQUIERDO y DERECHO, ambos con borde de 1 px.

Como puedo hacer que si uno de los dos es mas alto que el otro, pos se extiendan con = altura ?

El DIV IZQ tiene FLOAT:LEFT; width=48% y el DIV DERE tiene FLOAT: RIGHT; width: 48%

Asi que si el IZQ tiene 50 parrafos, pero el DER solo 5 palabras, como le hago para que tengan ambos igual altura?

NOTA: ambos tienen border=1px solid.

asinox · 02-ago-2006, 17:46

estan anidados?

MonicaH · 02-ago-2006, 20:30

Asinox,

estan asi:

<div class="global">
<div float left>info</div>
<div float right>info</div>
</div>

Y cada uno tiene su border = 1

MonicaH · 04-ago-2006, 11:53

Ayuda plis

Nigel · 04-ago-2006, 12:33

Es que me temo que es imposible xD. A no ser que ambos divs tenga una altura fija, o emplees trucos visuales, como que los dos divs tengan aspecto "invisible" y sea el div contenedor el que mediante una imagen de fondo, simule "enmarcar" a los dos contenidos.

Mira, aquí te paso un ejemplo que acabo de crear, a ver si te sirve:
[mods.solzimer.es/david/examples/twosameheight.html]

javier.perez · 04-ago-2006, 13:15

¿Has probado a poner un height:100% a ambos div?

<html>
<head>
<style>
#global {width:200px; height:100px; }
#left {float:left; background:#0a0; }
#right {float:right; background:#a00; }
#left, #right {height:100%; color:#fff; }
</style>
</head>
<body>
<div id="global">
<div id="left">info left</div>
<div id="right">info right</div>
</div>
</body>
</html>

MonicaH · 04-ago-2006, 19:30

Pos me va de maravilla con la ayuda de [javier.perez]

Muchas gracias

Una curiosidad:

http://www.forosdelweb.com/showthrea...58#post1649758

MonicaH · 04-ago-2006, 21:23

Por ir de afan no lei en detalle el URL donde [NIGEL] tiene la amabilidad de darme una igualmente excelente ayuda.

Valla que es bonito el ejemplo!

Muchas gracias amigos, ya me han dado dos formas de resolverlo!.

02-ago-2006, 12:08	#1 (permalink)
MonicaH Fecha de Ingreso: junio-2006 Mensajes: 329	Dentro de DIV Padre los DIV A y B, como hacer que ambos tengan=altura? Hola, Dentro del DIV class="GLOBAL" Tengo los DIV IZQUIERDO y DERECHO, ambos con borde de 1 px. Como puedo hacer que si uno de los dos es mas alto que el otro, pos se extiendan con = altura ? El DIV IZQ tiene FLOAT:LEFT; width=48% y el DIV DERE tiene FLOAT: RIGHT; width: 48% Asi que si el IZQ tiene 50 parrafos, pero el DER solo 5 palabras, como le hago para que tengan ambos igual altura? NOTA: ambos tienen border=1px solid. Última edición por MonicaH; 02-ago-2006 a las 12:11. Razón: d

02-ago-2006, 17:46	#2 (permalink)
asinox Fecha de Ingreso: noviembre-2002 Ubicación: httpdocs Mensajes: 2.561	estan anidados? __________________ www.noxmediastudio.com asinox.wordpress.com

04-ago-2006, 12:33	#5 (permalink)
Nigel Fecha de Ingreso: agosto-2006 Ubicación: Madrid Mensajes: 95	Es que me temo que es imposible xD. A no ser que ambos divs tenga una altura fija, o emplees trucos visuales, como que los dos divs tengan aspecto "invisible" y sea el div contenedor el que mediante una imagen de fondo, simule "enmarcar" a los dos contenidos. Mira, aquí te paso un ejemplo que acabo de crear, a ver si te sirve: [mods.solzimer.es/david/examples/twosameheight.html] Última edición por Nigel; 04-ago-2006 a las 13:05.

Herramientas
Mostrar Versión Imprimible Enviar por Correo
Desplegado
Mode Lineal Cambiar a Modo Hibrido Cambiar a Modo Hilado

02-ago-2006, 20:30	#3 (permalink)
MonicaH Fecha de Ingreso: junio-2006 Mensajes: 329	Asinox, estan asi: <div class="global"> <div float left>info</div> <div float right>info</div> </div> Y cada uno tiene su border = 1

04-ago-2006, 11:53	#4 (permalink)
MonicaH Fecha de Ingreso: junio-2006 Mensajes: 329	Ayuda plis

04-ago-2006, 13:15	#6 (permalink)
javier.perez Fecha de Ingreso: julio-2006 Ubicación: Madrid, España Mensajes: 8	¿Has probado a poner un height:100% a ambos div? <html> <head> <style> #global {width:200px; height:100px; } #left {float:left; background:#0a0; } #right {float:right; background:#a00; } #left, #right {height:100%; color:#fff; } </style> </head> <body> <div id="global"> <div id="left">info left</div> <div id="right">info right</div> </div> </body> </html>

04-ago-2006, 19:30	#7 (permalink)
MonicaH Fecha de Ingreso: junio-2006 Mensajes: 329	Pos me va de maravilla con la ayuda de [javier.perez] Muchas gracias Una curiosidad: http://www.forosdelweb.com/showthrea...58#post1649758

04-ago-2006, 21:23	#8 (permalink)
MonicaH Fecha de Ingreso: junio-2006 Mensajes: 329	Por ir de afan no lei en detalle el URL donde [NIGEL] tiene la amabilidad de darme una igualmente excelente ayuda. Valla que es bonito el ejemplo! Muchas gracias amigos, ya me han dado dos formas de resolverlo!.