Situar la web en el centro de la ventana del navegador

guigue · #1 (**permalink**) 19/02/2007, 04:25

Hola a todos, quería saber cómo establecer la situación de la web en el centro horizontal de la ventana del navegador independientemente del tamaño de esta o si se redimensiona. Creo que hay una forma de hacerlo usando marcos, ¿hay alguna forma que no perjudique el posicionamiento o indexación de la página?

Gracias.

Shade · #2 (**permalink**) 19/02/2007, 06:39

mmm para ello tendras que tener el contenido dentro de un div y a este establecerle mediante css:
margin: 0px auto; (se pone en el centro de izquierda-derecha)
margin: auto 0px; (se pone en el centro de arriba-abajo)
margin: auto auto; (se pone en el centro totalmente)

xik21 · #3 (**permalink**) 19/02/2007, 08:15

Código:

body{			
	position:absolute;
	margin:auto;
	left: 50%;
        top: 50%;
        width: 745px;
        height: 559px;
        margin-top: -279.5px;/*la mitad de height en negativo*/		
	margin-left: -372.5px;/*la mitad de width en negativo*/
}

Yo lo hago así, espero que te sirva,

SALUDOS

Shade · #4 (**permalink**) 19/02/2007, 08:44

xik21 el problema es que con lo que tu haces igual solo sirve para algunas resoluciones. porque calculas el margin top y left en base a determinados pixels.

xik21 · #5 (**permalink**) 19/02/2007, 13:08

voy a provar lo que que me dices.

no me pone en el centro la pantalla, se queda arriba y a la izquierda. alguna solución para no usar mi codigo?

Mikmoro · #6 (**permalink**) 19/02/2007, 13:32

Esto sirve para cualquier resolución de pantalla y cualquier tamaño de ventana, porque la distancia no está hecha en base a pixels sino a porcentajes. Lo que que está en base a pixels son los márgenes negativos, que toman como referencia el tamaño de la caja, que tiene un tamaño en pixels.

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>solicion alternativa</title>
  <style type="text/css">
#contenido { position: absolute;
width: 400px;
height: 400px;
top: 50%;
left: 50%;
margin-top: -200px;
margin-left: -200px;
background-color: rgb(204, 153, 51);
display: block;
}
  </style>
</head>
<body>
<div id="contenido"></div>
</body>
</html>

No obstante, creo que lo que "guigue" preguntaba era por centrado horizontal, que se resuelve (si no hay otras complicaciones), con un margin: 0 auto;

El auto no sirve para el centrado vertical.

Mikel.

iconogt · #7 (**permalink**) 20/02/2007, 10:41

Hola a todos [as],

Aqui hay una posible solución al problema, espero les sirva

si puedo ayudarlos en algo mas con mucho gusto

http://www.forosdelweb.com/f53/quiero-pagina-centrada-437880/

marcosr · #8 (**permalink**) 20/02/2007, 13:17

Para solo centrarla horizontalmente debes simplemente colocar a todas las capas dentro de una capa contenedor y crear un CSS cómo el siguiente, así me funciona perfecto.

Código HTML:

#contenedor {
margin: auto;
}

axterixv · #9 (**permalink**) 20/02/2007, 14:59

Hola!

Tu respuesta en formato CSS seria algo asi.

Código:

/* En tu seccion de estilos */
#centrado {margin: auto;}

<!-- En tu codigo -->
<div id="centrado">
<p>Aqui deberias de colocar algo que quieras centrar</p>
</div>

Ahora el resto depende de que quieras centrar en esa sección.

Saludos.

miketrix_esp · #10 (**permalink**) 21/02/2007, 02:10

Yo también lo centro con el "margin: auto;" pero si mal no recuerdo, esto no funciona muy bien con IE, almenos la 6 o inferior, la IE7 ni idea (no lo tengo).

JavierB · #11 (**permalink**) 21/02/2007, 02:17

Hola miketrix_esp

margin:auto funciona bien en IE 6, si le pones un DOCTYPE a la página.

Saludos,

guigue · #12 (**permalink**) 22/02/2007, 06:46

Hola, he estado liado unos días y no he podido mirar las respuestas.
Gracias a todos, por lo que veo todos hablan de capas en vez de tablas.
Cuando empecé con el dreamweaver y al venir de diseño empecé usando capas hasta q vi que había problemas en los navegadores. Debo entender que ya no pasa porque estoy hecho un lío.
Tengo que ponerme al día de nuevo en maquetación web

, el flash ha sido lo unico que he usado en algunos años