hola amigos, bueno este es un tema algo repetido ... pero no he podido dar con una solucion exacta a mi problema y espero me puedan ayudar!
He visto los tutoriales sobre como obtener un div con una altura del 100% pero estos los aplican en el body... lo que yo deseo es aplicarlo dentro de un contenedor con un ancho fijo y
sin altura establecida.
Aquí dejo el ejemplo que estoy intentando realizar:
Código:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejemplo</title>
<style type="text/css" media="screen">
* {
padding: 0;
margin: 0;
}
body {
background: #333333;
}
* html #container {
height: 100%;
}
#container { width: 900px; position:relative; margin: 10px auto; background:#009933 }
#left {
margin:0;
padding:0;
width:200px;
height:600px;
color:#333;
background:#eaeaea;
border:1px solid #333;
}
#right {
position:absolute;
right: 0;
top: 0;
padding:0;
width:200px;
height:100%;
color:#333;
background:#eaeaea;
border:1px solid #333;
}
</style>
</head>
<body>
<div id="container">
<div id="left">div con altura fija</div>
<div id="right">mi div 100% height</div>
</div>
</body>
</html>
Según el tutorial el div 100% height hereda la altura del contenedor que tenga 100% height, pues esto me funciona bien en en IE7, IE8, Firefox, Chrome y Opera... pero no hereda la altura en IE6
Pues he probado con un :
Código:
html , body {
height: 100%;
}
Pero en esta ocasión en IE6 el div se expande en toda la altura de la ventana de navegación, sobrepasando el contenedor....
Me gustaría saber si es posible arreglar algo en IE6 para que funcione... o usar javascript?... espero me puedan ayudar en esto, gracias!.