Aca dejo mi primer problema. Soy nuevo en esto del diseño Web, estuve leyendo 2 pdf de www.librosweb.es, sobre HTML y CSS. Y ahora estoy tratando de hacer mi primera pagina......
El primer problema que se me presento, es que al minimizar y reducir el tamaño del navegador, el div del cuerpo se corre hacia abajo del menu lateral izquierdo.
Asi es como quiero que se vea siempre
Y asi es como me corre el div del cuerpo cuando minimizo el navegador
Les dejo el codigo HTML y la hoja de estilo.
Código HTML:
<html> <head> <link href="for2.css" type="text/css" rel="stylesheet"/> </head> <body> <div id="contenedor"> <div id="cabecera"> <p> rock </p> </div> <div id="menulateral"> <ul id="lista"> <li> <a href="#">Inicio</a></li> <li> <a href="#">Bandas</a></li> <li> <a href="#">Contacto</a></li> </ul> </div> <div id="cuerpo"> <p>Aca va la informacion</p> </div> <div id="pie"> </div> </div> </body> </html>
CSS
body{
background-image:url(imgfondo2.jpg);
background-repeat:repeat;
text-align:center;
}
#cabecera, #cuerpo{
color: green;
text-align: center;
}
#pie{
clear:both;
}
#contenedor {
overflow:hidden;
}
#menulateral {
Width: 150px;
float: left;
}
#cuerpo{
width: 550px;
float: left;
}
#cabecera{
font-size: 3.5em;
}
#menulateral li {
list-style: none;
}
#menulateral li a {
background-image:url(imgfondo2.jpg);
background-repeat:repeat;
display: block;
text-decoration: none;
color: green;
margin: 1em;
}
#menulateral, #cabecera, #cuerpo {
background-image:url(imgfondo.jpg);
background-repeat:repeat;
border-width: 0.1em;
border-color: black;
border-style: solid;
}
Gracias a todos!
