Una imagen vale mas que 1000 palabras.
Ese es el esquema de mi web, dentro de la capa contenido meteré mas capas para crear el diseño, etc... pero en general me interesa saber como hacer que la capa contenido llegue hasta abajo del todo.
He leido un monton de webs, tutoriales y trucos, y ninguno funciona.
Algo hago mal y no se que es.
En mi web he empleado un reset de css.
Y este es el código css creado por mi para mi web:
Código:
html,body{
height:100%;
}
body{
background-color:#000000;
padding:0px;
margin:0px;
overflow-x: hidden;
}
body, div, p {
font-family:Arial, Verdana, Helvetica, sans-serif;
font-size:12px;
color:#000000;
}
/* ESTILOS ENLACES MENU */
a.enlacemenu:link, a:visited{
font-size:24px;
color:#000000;
text-decoration:none;
}
a.enlacemenu:hover{
color:#FFFFFF;
text-decoration:none;
}
/*----------------------*/
/* ESTILOS LISTA MENU */
.ul{
list-style:none;
margin:0px;
padding:0px;
}
li{
display:inline;
margin:10px;
padding:10px;
border:1px solid #000000;
text-shadow:#0099CC;
}
/*----------------------*/
/* ESTRUCTURA DE LAS CAPAS */
div#layout{
z-index:0;
position:relative;
margin:0 auto;
width:100%;
height:auto !important;
height:100%;
min-height:100%;
background-color:#CC3333;
}
div#header{
z-index:1;
background-image:url(img/header_fondo_01.jpg);
background-repeat:repeat-x;
background-attachment:scroll;
background-position:left top;
background-color:#FFFFFF;
top:0px;
left:0px;
height:50px;
width:100%;
position:relative;
border-top:1px solid;
}
div#menu{
z-index:2;
background-image:url(img/menu_fondo_01.jpg);
background-repeat:repeat-x;
background-position:0px 0px 0px 0px;
background-color:#ff6699;
top:0px;
left:0px;
height:80px;
width:880px;
padding-top:20px;
padding-left:20px;
position:relative;
margin:auto;
overflow:hidden;
}
div#contenido{
z-index:2;
background-color:#FF9966;
top:0px;
left:0px;
height:100%;
width:880px;
padding-left:20px;
padding-bottom:150px;
padding-top:20px;
position:relative;
margin:auto;
}
div#footer{
z-index:3;
position:absolute;
width:100%;
height:150px;
bottom:0px;
background-image:url(img/footer_fondo_01.jpg);
background-position:left bottom;
background-repeat:repeat-x;
background-color:#996666;
margin:auto;
clear:both;
}
/*----------------------*/
¿Estoy haciendo algo mal?, necesito algún consejo.
¡Mil gracias de antemano!