Ver Mensaje Individual
  #4 (permalink)  
Antiguo 12/02/2007, 11:59
Avatar de Mikmoro
Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Re: Problema acomodando <DIV>

Hola, Enrique.
Lo que tu has hecho, si a ti te vale está bien.
Sí que es cierto que como dices, por problemas al posicionar, hay algunas cosas raras: repites el gráfico de cabecera en la fila (tr) y luego en la celda (td), pones gráficos como la casa o el fondo del menu sobre gráficos que ya tienes en la imagen de fondo, etc., pero como te digo, si te apaña, adelante.

Por si te apetece aprender un poco a usar CSS, te pongo como sería tu código basado en la plantilla que te mandé de 3 columnas. Así, aunque no lo cambies, si tienes ganas lo estudias un poco y ves lo eficiente que puede ser usar hojas de estilo en lugar de tablas para maquetar.

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Tres capas</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
  <style type="text/css">
html, body { margin: 0pt;
padding: 0pt;
height: 100%;
background-image: url(Fondo.gif);
}
#capaMadre { margin: 0pt auto;
position: relative;
height: auto ! important;
min-height: 100%;
height: 100%;
width: 802px;
background-color: rgb(255, 255, 255);
}
#cabecera { background-image: url(HeaderCompleto.jpg);
height: 170px;
text-align: left;
}
#cuerpo { margin: 20px;
position: relative;
display: block;
background-color: rgb(255, 255, 255);
}
#pie { position: absolute;
bottom: 0pt;
color: rgb(255, 255, 255);
text-align: center;
width: 100%;
clear: both;
background: url(Cesped.jpg) no-repeat center bottom;
height: 77px;
}
#casita {
display: block;
height: 60px;
position: relative;
top: 27px;
left: 131px;
width: 60px;
}
#casita:hover { background: url(LogoCasitaOn.gif) no-repeat;
}
ul { list-style-type: none;
float: right;
position: relative;
top: 16px;
}
li { float: left;
}
li a { background: url(menu_02.png) no-repeat;
display: block;
width: 60px;
height: 46px;
position: relative;
left: -7px;
}
li a:hover { background: url(menu_02.png) left bottom;
}
  </style>
<!--[if IE]><style>ul {top: 32px;}</style><![endif]-->
</head>
<body>
<div id="capaMadre">
<div id="cabecera"><a id="casita" href="#"></a>
<ul>
  <li><a class="homeActive" href="http://cssvault.com"></a></li>
  <li><a class="gallery" href="/gallery.php"></a></li>
  <li><a class="resources" href="/resources.php"></a></li>
  <li><a class="submit" href="/submit_link.php"></a></li>
</ul>
</div>
<div id="cuerpo"></div>
<div id="pie"></div>
</div>
</body>
</html>
Ya contarás. Un saludo.

Mikel.