Les cuento...
Resulta que estoy rediseñando un sitio web y mas alla del nuevo diseño y demas cosas, la idea es que se pueda ver de forma centrada en el navegador.
Estube investigando bastante por la red y la forma aparente es atraves de CSS, por ejemplo asi: http://www.forosdelweb.com/f53/centrar-pagina-entera-364944/
o asi..
http://www.agenciaweb.cl/blog/centrar-contenido-pagina.htm
Pero no logro que se vea centrada, con esta ultima opcion si yo creo una pagina nueva y coloco lo que figura en la pagina que linkie ultimo osea esto
Código HTML :
< HTML >
<head>
<style type="text/css">
body{
text-align:center;
margin:0 auto;
}
#contenedor{
margin: 0 auto;
text-align:left;
width:70%;
}
</style>
</head>
<body>
<div id="contenedor">
el contenido de tu página acá
</div>
</body>
</HTML> me muestra centrada un cuadrado, una capa, y voy canvinando la resolucion para probar y se centra perfecto en cualquier resolucion, ahora cuando intento insertar dentro de esa capa el diseño que ya tengo echo tambien con capas, como si perdiera la extructura ya no se ve centrado, o se ve centrado en 1024 pero cuando lo paso a 800x600 no se ve centrado, he echo muuuchas pruebas con otros codigos pasando de px a % ya se me ha echo lio de tanto probar, seguio investigando y encontre otra opcion...
Código HTML :
<html>
<head>
<script>
function centrarCapa(obj) {
an=parseInt(document.getElementById(obj).style.width);
al=parseInt(document.getElementById(obj).style.height);
x=(document.body.clientWidth-an)/2;
y=(document.body.clientHeight-al)/2;
document.getElementById(obj).style.left=x;
document.getElementById(obj).style.top=y;
}
</script>
</head>
<body onLoad="centrarCapa('Layer1')" onResize="centrarCapa('Layer1')">
<div id="Layer1" style="border:1px solid red; position:absolute; width:200px; height:115px; z-index:1"></div>
</body>
</html>
esta opcion me resulto a la perfeccion, si no fuera por un pequeño detalle, en Internet Explorer se ve perfectamente centrada sea la resolucion que sea, pero con otro navegador, por ejemplo mozilla firefox no se ve centrado se ve justificado a la izquierda y hoy por hoy cada ves son menos los que usan internet explorer, por ende quisiera que me funcionara con cualquier navegador he aqui donde ya se me quemaron todos los papeles y solicito ayuda o para modificar este ultimo codigo para que no solamente se pueda ver centrado en IE si no tambien en otros navegadores o me digan como aplicar las formas de centrarlo del modo CSS.
Aclaro que soy muy basico en todo esto, yo diseño paginas web con dreamweber y simpre en modo diseñador, no en modo codigo osea que no se de codigo, asi que si me dicen agrega tal cosa, por favor agradeceria que me expliquen como a un niño osea coloca esto antes o despues de es mas voy a pegar el codigo de mi pagina y si directamente me lo pueden corregir y luego explicarme que se corrigio mejor.
Estoy pidiendo mucho no?
bueno cualquier ayuda se agradece.aca el codigo de mi web.
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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>La guia de Bares y Restaurantes</title>
<style type="text/css">
<!--
.Estilo16 {font-family: Arial, Helvetica, sans-serif; color: #666666;}
.Estilo17 {color: #666666}
.Estilo2 {font-family: "CopprplGoth Bd BT";
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
}
.Estilo21 {font-family: Arial, Helvetica, sans-serif; color: #666666; font-weight: bold; }
#Layer1 {position:absolute;
left:0px;
top:-2px;
width:770px;
height:100px;
z-index:4;
}
#Layer10 {position:absolute;
left:345px;
top:368px;
width:400px;
height:626px;
z-index:11;
}
#Layer11 {
position:absolute;
left:auto;
top:0%;
width:760px;
height:1190px;
z-index:1;
background-color: #000000;
}
#Layer4 {position:absolute;
left:165px;
top:225px;
width:583px;
height:100px;
z-index:6;
}
#Layer5 {position:absolute;
left:0px;
top:216px;
width:152px;
height:100px;
z-index:10;
}
#Layer6 {position:absolute;
left:100px;
top:218px;
width:653px;
height:963px;
z-index:5;
background-color: #000000;
}
#Layer7 {position:absolute;
left:99px;
top:1079px;
width:639px;
height:100px;
z-index:7;
}
#Layer8 {position:absolute;
left:170px;
top:319px;
width:150px;
height:100px;
z-index:8;
}
#Layer9 {position:absolute;
left:-20px;
top:1051px;
width:770px;
height:27px;
z-index:9;
}
body {
background-image: url(imag/bodybg.jpg);
}
-->
</style>
</head>
<html>
<head>
<script>
function centrarCapa(obj) {
an=parseInt(document.getElementById(obj).style.width);
al=parseInt(document.getElementById(obj).style.height);
x=(document.body.clientWidth-an)/2;
y=(document.body.clientHeight-al)/2;
document.getElementById(obj).style.left=x;
document.getElementById(obj).style.top=y;
}
</script>
</head>
<body onLoad="centrarCapa('Layer1')" onResize="centrarCapa('Layer1')">
<div id="Layer1" style="border:1px solid blue; position:absolute; width:771px; height:6px; z-index:1;">
<div id="Layer11">
<div id="Layer4">
<div id="layer">
<p align="justify" class="Estilo16"><strong>N</strong>oche<strong>I</strong>nter<strong>U</strong>rbana es la primer y única guía de bares y restaurantes de las Sierras de Córdoba. En ella podrá encontrar todo lo relacionado con la gastronomía, música, diversión, entre otras actividades. También encontrará los mejores lugares para disfrutar del día y el aire de las sierras....</p>
<p align="justify" class="Estilo16"> </p>
</div>
</div>
<div id="Layer5">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="155" height="450">
<param name="movie" value="botonera.swf" />
<param name="quality" value="high" />
<embed src="botonera.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="155" height="450"></embed>
</object>
</div>
<div id="div"><img src="imag/cabecera.jpg" alt="1" width="764" height="207" /></div>
<div id="Layer6"></div>
<div id="Layer7">
<div align="center">
<p class="Estilo1 Estilo2 Estilo17"> www.nocheinterurbana.com.ar es un producto de Lizio Creatividad y Diseño|[email protected] | Tel. 54-3543-15559303 | © 2001/2010 Todos los derechos reservados.| Optimizado para Internet Explorer. Resolución 800x600 </p>
<p class="Estilo1 Estilo2 Estilo17">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="200" height="20">
<param name="movie" value="imag/By-lizio.swf" />
<param name="quality" value="high" />
<embed src="imag/By-lizio.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="200" height="20"></embed>
</object>
</p>
</div>
</div>
<div id="Layer8">
<p align="center"><span class="Estilo21">Click en la zona que desea ver.</span><img src="imag/VdlChicas.jpg" alt="Valle de Las Sierras Chicas" width="150" height="120" /></p>
<p><img src="imag/VdC.jpg" alt="Valle de Calamuchita" width="150" height="120" /></p>
<p><img src="imag/VdP.jpg" alt="Valle de punilla" width="150" height="120" /></p>
<p><img src="imag/VdT.jpg" alt="Valle de Traslasierra" width="150" height="120" /></p>
<p><img src="imag/OCdlP.jpg" alt="Otras Ciudades" width="150" height="120" /></p>
<p> </p>
</div>
<div id="Layer9"><img src="imag/pie.jpg" alt="3" width="803" height="24" /></div>
<div class="Estilo16" id="Layer10">
<p align="justify">En el <strong>Valle de las Sierras Chicas</strong>, encontrara una guia de los bares y restaurantes de Villa Allende, Mendiolaza, Unquillo, Rio Ceballos, Salsipuedes, Agua de Oro, Ascochinga, Saldan, La Calera, Jesus Maria, Colonia Caroya, entre otras localidades del valle. </p>
<p align="justify"> </p>
<p align="justify">En el <strong>Valle deCalamuchita</strong>, encontrara una guia de los bares y restaurantes de Villa Gral Belgrano, Santa Rosa de Calamuchita, La Cumbresita, Embalse, Villa del Dique, Yacanto, entre otras localidades del valle. </p>
<p align="justify"> </p>
<p align="justify">En el <strong>Valle de Punilla </strong>, encontrara una guia de los bares y restaurantes de Carlos Paz, Tanti, Bielet Masse, Cosquin, Valle Hermoso, La Falda, Villa giardino, La Cumbre, Los Cocos, Capilla del Monte, entre otras localidades del valle. </p>
<p align="justify"> </p>
<p align="justify">En el <strong>Valle de Traslasierra</strong>, encontrara una guia de los bares y restaurantes de Mina Clavero, Nono, Cura Brochero, Panaholma, Los Hornillos, San Javier, Yacanto, La Paz, entre otras localidades del valle. </p>
<p align="justify"> </p>
<p align="justify"> </p>
<p align="justify">En <strong>otras ciudades</strong>, encontrara una guia de los bares y restaurantes de Rio Cuarto, Villa Maria, Alta Gracia, Villa Dolores, entre otras ciudades de Cordoba. </p>
</div>
</div>
</div>
</body>
</html>
<body>
</body>
</html>
