Wenas... antes que nada, feliz año para todos!......
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!