default.css
/* ------------------------------
Estructura de la página
------------------------------ */
#general{
margin:0;
margin-left:122px;
margin-right:122px;
/*width:auto;*/
background-color:#ff3333;
}
/*
#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; */
width:780px;
height:497px;
background-color:#556644;
border:0px;
display:block;
/*
border-top:0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
*/
}
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:#fe8f00;
font:arial;
font-weight:bold;
}
#main {
display:inline;
text-align:center;
background-color:#444551;
width:780px;
height:498px;
}
/****Barra de navegación*****/
#menu-izq{
display:block;
background-color:#f9be78;
width:208px;
height:200px;
float: left;
}
#menu-izq ul, #menu-izq ul li{padding:0; margin:0; list-style:none; float:left;}
#menu-izq a{color:#FFFFFF; font-weight:bold;}
#menu-izq a:hover{color:red;}
#menu-izq li a:link, #menu-izq li a:visited {background:#444444; 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{
display:block;
height:40px;
width: 780px;
border-top:1px solid;
text-align:center;
background-color:#fe8f00;
}
#texto{
font:10px Verdana;
text-align:justify;
}
/*
p.contacto{font-family:Arial; font-size:18px; font-style:negrita}
*/
index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sp" lang="sp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/default.css" rel="stylesheet" type="text/css" />
<title>TONI MAS</title>
</head>
<body id="general">
<div id="container">
<div id="topbar">parte superior</div>
<div id="marquesina">Listado de Inmuebles de Antonio Mas Mañez</div>
<div id="main">
<div id="menu-izq">menu izquierdaaaaaaaaaaaaa viva la izquierda lalalalallalalalalaal viva viva</div><div>hola main</div>
</div>
<!-- <div class="spacer"></div> -->
<div id="footer">Página desarrollada por Rubén Ferrer Ortiz</div>
</div>
</body>
</html>