Código HTML:
Ver originalhtml, body {
height: 100%;
}
/*
#container tiene un ancho absoluto de 780 pixeles.
El ancho de los elementos internos estan establecidos a auto,
por lo que todos tendrán el ancho del elemento contenedor.
*/
#container{
/*width:auto;*/
/*background-color:#ffe0ab; height:670px;*/
width:780px;
margin: 0 auto;
min-height:100%;
background-color:#888888;
border:0px;
border-left: 5px solid #5D5D5D;
border-right: 5px solid #5D5D5D;
/*
display:block;
border-right: 5px solid #5D5D5D;
border-left: 5px solid #5D5D5D;
border-top:0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
*/
}
/*estilo para los enlaces*/
a:link {
link="#ffffcc"; vlink="#ffffcc"; alink="#ffffcc";
}
a:visited{
link="#ffffcc"; vlink="#ffffcc"; alink="#ffffcc";
}
p{
font:11px Verdana;
text-align:justify;
}
/***************Header**********************/
#topbar{
display:block;
height:auto;
width:780px;
font-size:1; /*for eliminate space between images*/
/*border-top:2px solid;
border-right: 2px solid;
border-bottom: 2px solid;
border-left: 2px solid;
border-top-color: #CCCCCC;
border-right-color: #CCCCCC;
border-bottom-color: #CCCCCC;
border-left-color: #CCCCCC;*/
}
#marquesina{
display:block;
text-align:center;
width:780px;
height:24px;
background-color:#afafaf;
font:arial;
font-weight:bold;
}
h3 {
text-align: left;
font-size: 16px;
color: #000000;
margin-top: 15px;
border-bottom: 3px double #ffffff;
background-color:#f66e78;
}
#main {
display:block;
text-align:center;
background-color:#f66e78;
/*background-color:#dbd6db;*/
width:780px;
height:auto;/*auto*/
min-height:498px;
/*height:498px;min-height:100%;width:780px;*/
}
/****Barra de navegación*****/
#menu-der{
display:inline;
background-color:#f66e78;
width:572px;
height:auto;
/*min-height:498px;
height:auto;
min-height:200px;
min-height: 100%;*/
float: right;
}
#menu-izq{
display:inline;
background-color:#f66e78;
width:208px;
/*height:auto;
min-height:200px;
min-height: 100%;*/
float:left;
}
#menu-izq ul, #menu-izq ul li{padding:0; margin:0; list-style:none; float:left;}
#menu-izq a{color:#000000; font-weight:bold;text-decoration:none;}
#menu-izq a:hover{color:red;}
#menu-izq li a:link, #menu-izq li a:visited {background:#f66e78; text-decoration:none; height:24px; line-height:24px; display:inline; float:left; width:auto; padding:0px 10px;}
/***************Contenido principal************/
/*
div.spacer, soluciona el alto de #main en diseños con 2 columnas*/
div.spacer{clear:both; height:10px; display:block;}
/***************footer*********************/
#footer{
position: fixed;
top:800px;
color:#ffffff;
font-size:14px;
display:block;
height:40px;
width: 780px;
border-top:1px solid #5D5D5D;
background-color:#775533;
text-align: center;
margin: 0 auto;
}
#texto{
font:10px Verdana;
text-align:justify;
}
.menuizq{
font-weight:bold;
text-align:left;
font-size: 12px;
}
/*
p.contacto{font-family:Arial; font-size:18px; font-style:negrita}
*/
.fadebox{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
.overbox {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 55%;
padding: 16px;
border: 16px solid orange;
background-color: white;
z-index:1002;
overflow: auto;
}
p.contacto{font-family:Arial; font-size:18px; font-style:negrita}
este seria mi css