Ola quiero poner a un div una altura del 100% de la pagina pero no se como hacerlo. he probado a ponerle height:100% al body y html pero sigue sin funcionar.
Este es el archivo css
Código HTML:
html {
height:100%;
}
body{
height:100%;
padding:0px;
margin:0px;
background-color: #FFFFFF;
text-align:center;
}
#container {
padding: 0;
height:auto;
width:1152px;
background-image: url(imagenes/menu/pie3.jpg);
background-position:bottom left;
background-repeat: no-repeat ;
margin: 0 auto 0 auto;
text-align:left
}
#header{
width:100%;
height:auto;
margin:10px 0 0px 0px;
text-align: center;
}
#izquierda{
width:170px;
height:100%;
margin:0 20px 0 0px;
float:left;
padding:0px;
}
#menu{
float:left;
margin:0;
width:720px;
display:inline;
}
#principal{
height:100%;
margin:0;
width:720px;
padding:0px;
display:inline;
POSITION: relative;
}
#derecha{
width:215px;
height:100%;
margin:0 0px 0 0px;
float:right;
padding:0;
background-image: url(imagenes/menu/lateral2.jpg);
background-position:right;
background-repeat:repeat-y;
}
#pie{
width:100%;
height:246px;
margin:0px 0 0px 0px;
text-align: center;
background-image: url(imagenes/menu/pie2.jpg);
background-position:right;
background-repeat: no-repeat ;
clear:both;
}
Y aqui el html:
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<link href="1estructura.css" rel="stylesheet" type="text/css">
<link href="estilo.css" rel="stylesheet" type="text/css">
<link href="cuadros.css" rel="stylesheet" type="text/css">
</HEAD>
<BODY>
<div id="container">
<div id="header"><img src="imagenes/menu/logos/cabezera_3.jpg" width="1152" height="209" alt="BpmLokos"></div>
<div id="izquierda">
<div class="menu_top">
<div align="left"><div class="pestana"></div></div>
</div><br>
<div class="menu"></div>
<div class="menu_down"></div>
<div class="menu_top">
<div class="pestana"></div>
</div>
<div class="menu"></div>
<div class="menu_down"></div>
<div class="menu_top">
<div class="pestana"></div>
</div>
<div class="menu"></div>
<div class="menu_down"></div>
<div class="menu_top">
<div class="pestana"></div>
</div>
<div class="menu">
</div>
<div class="menu_down"></div>
<div class="menu_top"><div class="pestana"></div></div><div class="menu"><span class="text_1">
</span></div><div class="menu_down"></div>
<div class="menu_top"><div class="pestana"></div></div>
<div class="menu"></div><div class="menu_down"></div>
</div>
<div id="derecha">
<div class="menu_top">
<div class="pestana"></div>
</div><br>
<div class="menu">
</div><div class="menu_down"></div>
<div class="menu_top"><div class="pestana"></div></div>
<div class="menu">
</div><div class="menu_down"></div>
<div class="menu_top"><div class="pestana"></div></div><div class="menu"></div>
<div class="menu_down"></div>
<div class="menu_top"><div class="pestana"></div></div>
<div class="menu"></div><div class="menu_down"></div>
<div style="clear:both;">
</div>
</div>
<div id="menu">
<div class="texto_top"> </div>
<div class="texto_center"></div>
<div class="texto_down"></div>
</div><br>
<div id="principal">
pagina
</div>
<div id="pie"></div>
<div style="clear:both;"></div>
</div>
</BODY>
</HTML> haber si me pueden ayudar, quiero que las tres columnas (los divs izquierda,derecha y principal) tengan el 100% de altura gracias.