Hola todos hace tiempo que no me pasa por aquí, pero he vuelto a programa en html+css y tengo un problemilla.
He estructurado la pagina Web, creo que mas o menos bien, pero cuando introduzco un párrafo <p>.. <p>, se me desplaza la capa en la cual esta hacia abajo y me estropea la maquetacion. Me imagino que esto será por que no he introducción bien las referencias relativos y absolutas, pero no encuentro información en Internet.
Os pongo el código por si podéis ayudarme.
Aquí tenéis la pagina Hmtl
Código:
<html>
<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="capas/disenno.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="contenedor">
<div class="cabecera"></div>
<div class="barra-lateral"> <p>Lateral</p> </div>
<div class="contenido">
<div class="Seleccion">
<div class="imagen_pilares_cabeza"><p>Me muevo</p></div>
</div>
<div class="Seleccion">
</div>
<div class="Seleccion">
</div>
</div>
<div class="pie">Prueba de pie</div>
</div>
</body>
</html>
Y aqui teneis la CSS:
Código:
.contenedor{
width: 900px;
margin: auto;
}
.cabecera {
background-color: blue;
height: 75px;
padding: 5px;
clear: both;
Margin-bottom: 10px;
}
.barra-lateral{
background-color: orange;
float:left;
width: 140px;
height: 100%;
}
.contenido{
background-color: gray;
float: left;
width: 750px;
height: 100%;
Margin-left: 10px;
}
.Seleccion{
background-color: red;
Margin-top: 10px;
float: left;
width: 227px;
height: 295px;
Margin-left: 10px;
}
.pie{
background-color:blue;
clear:both;
float: left;
Margin-top: 10px;
width: 900px;
Padding-bottom: 5px;
}
.imagen_pilares_cabeza{
background-image:url('../Imagenes/FondoCabecera_destaco_1.gif');
position:adsolute;
left:0px;
top:0px;
z-index:-1;
width: 226px;
height: 30px;
}
Muchas gracias a todos.