Capas en Dreamweaver

_eNGeLs_ · #1 (**permalink**) 03/02/2008, 07:54

Porque las capas en dreamweaver salen en diferente lugar en el navegador?

juaniquillo · #2 (**permalink**) 03/02/2008, 08:45

las 'capas' en dreamweaver, osea divs de posición absoluta, hacen lo que se supone que hagan. Se quedan en el mismo sitio no importa la resolución, y cuando digo en el mismo sitio quiero decir a la misma distancia en píxeles de las esquinas superior izquierda de tu navegador. A lo mejor estas comparando las capas con elementos centrados, los cuales si se mueven dependiendo de la resolución del usuario.

Asyut · #3 (**permalink**) 03/02/2008, 21:04

Hola engels. Tus capas se mueven por la razón que ha expuesto juaniquillo. Dependiendo de la resolución de pantalla del usuario que la vea estas se veran de una forma u otra, si quieres que siempre te salgan centradas puedes usar el siguiente codigo.

Despues del title pones:

<style type="text/css">

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}

#Nombre de tu capa {
position:absolute;
left:50%;
top:50%;
width:ancho de tu capa px;
height:alto de tu capa px;
margin-top: -mitad del alto de tu capa px;
margin-left: -mitad del ancho de tu capa px;
z-index:1;
}

</style>

En el body pones:

<div id="Nombre de tu capa"> contenido de tu capa </div>

yodelsur · #4 (**permalink**) 04/02/2008, 16:44

hola como estas mira sinceramente soy nuevo trabajando con capas y no se muicho de html aca te envio como he insdertado el codigo q pusiste y si bien se corre de lugar la capa no se me centran aca va el codigo q puse basandome en lo tuyo son solo 3 capas las subraye dime q puse mal y si podes darme un ejem`plo con una de ellas te estaria mas q agradecido ya q me tiene estancado este tema.. saludos!!!

</style></head>
<body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px
<div id="Layer1" style="position: absolute; left: 50%; top: 50%; width: 746px; height: 93px; z-index: 1; text-align: center"><img src="imagenes/banner%20.jpg" width="746" height="93"></div>
<div id="Layer2" style="position: absolute; left: 50%; top: 50%; width: 149px; height: 340px; z-index: 2; background: #161A25; text-align: center">
<p><font color="#000033" face="Broadway"><a href="home.htm"><font color="#FFFFFF" size="4">HOME</font></a></font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium"><a href="curriculum.htm">CURRICULUM</a></font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium"><a href="fechas.htm">FECHAS</a></font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium">GALERIA</font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium">DESCARGAS</font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium">VIDEOS</font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium">CONTACTO</font></p>
<p><font color="#FFFFFF" size="4" face="Algerian, BethsCuteHmkBold, BixAntiqueScriptHmk, BixAntiqueScriptHmkBold, BoogieWoogieHmk, BoogieWoogieHmkBold, Century Gothic, Centaur, Franklin Gothic Medium">LINKS</font><a href="#"><br>
</a></p>
</div>
<div id="Layer4" style="position: absolute; left: 50%; top: 50%; width: 563px; height: 336px; z-index: 4; background: #5D0201; text-align: center"><a href="#"> </a>
<p align="center"> </p></div>
</body>