<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<title>roverol</title>
<style type="text/css" media="screen">
body,html{
height:95%;
width:98%;
}
#contenido {
position:absolute;
border:10px solid #340711;
width:100%;
height:100%;
}
#cabecera {
position:relative; top:0px;
border:2px solid red;
}
#pie {
position:absolute; bottom:0px;
width:100%;
clear: both;
background-color:#77A888;
border:1px solid red;
}
#contenedor {
border:8px solid green;
margin:0px;
padding:0px;
height: 89%;
}
#menu4 {
float: left;
background-color:#FFA888;
border:2px solid blue;
position:relative; top:0px;
margin:0px;
width:150px;
height:100%;
}
#principal {
border:1px solid #3407FF;
background-color:#55FFAD;
margin:0px;
padding:0px;
height:100%;
}
#secundario {
border:1px solid #3407FF;
float: right;
background-color:#99A888;
margin:0px;
padding:0px;
width:200px;
height:100%;
}
</style>
</head>
<div id="contenido">
<div id="cabecera">
CABECERA
</div>
<div id="contenedor">
<div id="secundario">
SECUNDARIO
</div>
<div id="menu4">
<ul>
<li ><a href=''>Opcion 1</a></li>
<li ><a href=''>Opcion 2</a></li>
<li ><a href=''>Opcion 3</a></li>
<li ><a href=''>Opcion 4</a></li>
<li ><a href=''>Opcion 5</a></li>
<li ><a href=''>Opcion 6</a></li>
<li ><a href=''>Opcion 7</a></li>
</ul>
</div>
<div id="principal">
PRINCIPAL
</div>
</div>
<div id="pie">
PIE
</div>
</div>
</body>
</html>