Foros del Web - Ver Mensaje Individual - background top, middle y bottom separados =S

TheDark03 · #2 (**permalink**) 16/07/2010, 18:24

Hola...

mira para q evites usar <br> o &nbsp utiliza la propiedad

min-height:15px;

ahora en tu lista nunca cierras las etiquetas <li></li>

aca te dejo el code:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" a href="stile.css" type="text/css" />
</head>
<style>
body { 
background-image:url('flame.jpg');
background-repeat:no-repeat;
background-position:bottom left;
}
 
.top {
background-image:url("top.png");
background-repeat:no-repeat;
float:left;
width:1224px;
height:32px;
}
 
.middle {
float:left;
width:1224px;min-height:500px;
background-image:url("middle.png");
background-repeat:repeat-y;
}
 
.bottom {
float:left;
background-image:url("bottom.png");
background-repeat:no-repeat;
width:1224px;
height:32px;
}
 
#list,p {
padding-left:100px;
color:#FFFFFF;
}
 
</style>
<body>
 
<div class="top"><br/></div>
<div class="middle"><p>En este tema, tocaremos todo lo relacionado con la XHTML, HTML y CSS<br/>
aqui os dejo una lista con multiples temas:</p>
<ul compact id="list">
<li>Introduccion</li>
<li>Texto</li>
<li>Links</li>
<li>Anclas</li>
<li>Imagenes</li>
 
<li>Tablas</li>
<li>Listas</li>
<li>Formularios</li>
<li>Mapas</li>
<li><h1>Validacion del Codigo</h1> procura cerrar etiquetas</li>
</ul>
</div><div class="bottom"><br/></div>
</body>
</html>

Saludos