Problema con el texto HTML:
Código HTML:
<html> <head> <link rel="stylesheet" type="text/css" href="estilo5part3.css"> </head> <body> <div id="outer"> <div id="izquierda"></div> <div id="centro"> <div id="cabecera"><h1><span class="verde">ejercicios</span> & <span class="rojo">css</span></h1></div> <div id="menu"> <ul> <li class="first"><a href="#">homepage</a></li> <li><a href="#">my journal</a></li> <li><a href="#">my pictures</a></li> <li><a href="#">my favorites</a></li> <li><a href="#">contact me</a></li> </ul> </div> <div id="contenido"> <div id="contenido1">Veroeros Etiam <ul> <li>Lorem ipsum dolor sit amet</li> <li>Duis eget ipsum eget nisi semper</li> <li>Duis blandit dignissim velit</li> <li>Aenean sit amet massa et eros</li> <li>Phasellus malesuada feugiat velit</li> <li>Ut ut sem id ipsum pharetra porttitor</li> <li>Aenean facilisis risus sit amet purus</li> <li>Sed porta neque sed nulla</li> <li>Nunc volutpat quam a ante</li> <li>Aliquam dignissim dui quis arcu</li> <li>Praesent vel velit eu ligula viverra</li> <li>Cras ultricies metus eu elit</li> <li>In non augue eu enim lacinia tempus</li> <li>Donec blandit eros eleifend pede</li> <li>Integer sollicitudin nisi eget lorem</li> <li>Fusce quis sapien sed neque sodales</li> <li>Suspendisse condimentum fringilla</li> <li>Quisque id elit id odio venenatis</li> <li>Integer auctor facilisis mi</li> <li>Donec ultricies ultrices diam</li> <li>Praesent at urna et magna vehicula</li> </ul> </div> <div id="contenido2">2</div> <div id="contenido3">3</div> </div> <div id="copyright">Copyright (c) 2006 Sitename.com</div> <div id="pie"></div> </div> <div id="derecha"></div> </div> </body> </html>
Código HTML:
body{
width:100%;
height:100%;
overflow:hidden;
margin:0;
padding:0;
font-family:"trebuchet ms",sans-serif;
color:silver;
}
#izquierda,#centro,#derecha {
position: absolute;
float: left;
height:100%;
}
#izquierda{
background-color:#94ad35;
width:10%;
border-width:1px;
border-style:solid;
border-color:#9aae37;
}
#centro{
left:10%;
background-color:#f2f0f1;
width:80%;
}
#derecha{
left:90%;
background-color:#94ad35;
width:10%;
border-width:1px;
border-style:solid;
border-color:#94ab38;
}
#cabecera{
height:10%;
background-color:#f2f2e6;
padding-top:5px;
padding-bottom:5px;
padding-left:10px;
padding-right:5px;
}
#cabecera h1{
text-transform:uppercase;
font-family:"times new roman";
font-size: 2.5em;
}
.verde{
color: #94ad35;
}
.rojo{
color: #c53430;
}
#menu{
height:5%;
background-color:#94ad35;
background-image:url("images/img2.gif");
background-repeat:repeat-y;
background-position:bottom left;
}
#menu ul{
list-style:none;
text-align:center;
}
#menu li{
display:inline;
text-transform:capitalize;
text-align:center;
text-align:center;
vertical-align:middle;
font-size:100%;
}
a:link,a:visited,a:active{
text-decoration:none;
color:white;
}
a:hover{
background-image:url("images/img3.gif");
}
#contenido{
height:69%;
background-color:#f2f2e6;
}
#contenido1,#contenido2,#contenido3{
background-color:#f2f2e6;
float:left;
}
#contenido1{
height:100%;
width:30%;
float:left;
}
#contenido2{
height:30%;
width:70%;
float:left;
}
#contenido3{
height:70%;
width:70%;
}
#copyright{
height:4%;
background-color:#94ad35;
text-align:center;
color:white;
}
#pie{
height:4%;
background-color:#f2f2e6;
}
