Foros del Web » Creando para Internet » CSS »

centrar body

Estas en el tema de centrar body en el foro de CSS en Foros del Web. Hola comunidad Ahora me estoy metiendo en el mundo de las famosas CSS, de seguro lo han respondido millones de veces pero utilice el buscador ...
  #1 (permalink)  
Antiguo 08/05/2006, 01:03
Avatar de SidP  
Fecha de Ingreso: febrero-2006
Ubicación: /etc/php.ini
Mensajes: 129
Antigüedad: 11 años, 9 meses
Puntos: 2
centrar body

Hola comunidad
Ahora me estoy metiendo en el mundo de las famosas CSS, de seguro lo han respondido millones de veces pero utilice el buscador y no lo encontre, mi problema es el sigte
Como podria centrar toda mi pagina, porque ahora le he puesto la resolucion 800x600 y me sale a laizquierda completamente
Código HTML:
body {
	font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Helvetica, Arial, sans-serif;
	font-weight:normal;
	font-size:10pt;
	color:black;
	margin:0px 0px 0px 0px;
	width:800px;
	height:600px;
	padding:0px;
	background-image: url('background.gif');
   }
Gracias de antemano
  #2 (permalink)  
Antiguo 08/05/2006, 14:43
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
la forma de centrar cualquier elemento es:
1.- definirle el ancho
2.- definirle márgenes laterales iguales, por lo general se hace con "auto".

Además, siempre es bueno ponerle al body margin : 0; y padding: 0, ya que algunos navegadores le dan por defecto un margen y otros le ponen padding....

Una vez hecho eso, lo centrás como te mencioné arriba, por lo que quedaría:

body {
width : lo que sea;
margin-left : auto;
margin-right : auto;
padding : 0px;
}

Saludos.
  #3 (permalink)  
Antiguo 08/05/2006, 15:22
Avatar de Developer9
(Desactivado)
 
Fecha de Ingreso: abril-2005
Ubicación: Mi Ecuador del alma
Mensajes: 4.196
Antigüedad: 12 años, 8 meses
Puntos: 47
Oigan disculpen que me entrometa en el tema que no es mio pero...

de donde sacaste el body, yo tengo un css que tiene body
  #4 (permalink)  
Antiguo 08/05/2006, 15:36
Avatar de SidP  
Fecha de Ingreso: febrero-2006
Ubicación: /etc/php.ini
Mensajes: 129
Antigüedad: 11 años, 9 meses
Puntos: 2
no me funciona

Saludos Alvlin
guiandome por lo que me dijiste se lo he puesto a mi body pero ni modo, no me funciona, me sigue saliendo la pagina totalmente a la izquierda y no en el centro como deseo
Código:
body {
	font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Helvetica, Arial, sans-serif;
	font-weight:normal;
	font-size:10pt;
	margin-left:auto;
	margin-right:auto;
	width:800px;
	padding:0px;
       	margin:0px 0px 0px 0px;
        color:gray;
	background-image: url('background.gif');
   }
estoy probando las paginas con IE6 y Opera
que podria estar haciendo mal???

Gracias de antemano
  #5 (permalink)  
Antiguo 08/05/2006, 15:38
Avatar de SidP  
Fecha de Ingreso: febrero-2006
Ubicación: /etc/php.ini
Mensajes: 129
Antigüedad: 11 años, 9 meses
Puntos: 2
¿?

no entiendo tu pregunta Developer9

Sal2
  #6 (permalink)  
Antiguo 08/05/2006, 15:41
Avatar de Developer9
(Desactivado)
 
Fecha de Ingreso: abril-2005
Ubicación: Mi Ecuador del alma
Mensajes: 4.196
Antigüedad: 12 años, 8 meses
Puntos: 47
Que tengo un archivo css y no tiene body :

si tuviera body pudiera probar lo posteado en este tema
  #7 (permalink)  
Antiguo 08/05/2006, 16:15
Avatar de Mickel  
Fecha de Ingreso: mayo-2002
Ubicación: Lima, Peru
Mensajes: 4.619
Antigüedad: 15 años, 7 meses
Puntos: 7
agregale tu mismo esos datos al archivo css
__________________
No tengo firma ahora... :(
  #8 (permalink)  
Antiguo 08/05/2006, 16:21
Avatar de SidP  
Fecha de Ingreso: febrero-2006
Ubicación: /etc/php.ini
Mensajes: 129
Antigüedad: 11 años, 9 meses
Puntos: 2
al fin

Bueno problema resuelto, al fin pude centrar la pagina, el problema era que estaba utilizando ademas de el estilo que le di al body, estaba utilizando este (los 2 a la vez )
Código:
#align{
    border: 1px black solid;
	width:800px;
	margin-left:auto;
	margin-right:auto;
	padding:0px;
	
	}
y en el estilo del body le elimine esta la linea del width:800px; y funcionó.
Gracias a todos
Sal2
  #9 (permalink)  
Antiguo 08/05/2006, 16:40
Avatar de Developer9
(Desactivado)
 
Fecha de Ingreso: abril-2005
Ubicación: Mi Ecuador del alma
Mensajes: 4.196
Antigüedad: 12 años, 8 meses
Puntos: 47
y el auto para que sirve?
  #10 (permalink)  
Antiguo 09/05/2006, 19:21
Avatar de Hououji Ayumu  
Fecha de Ingreso: junio-2005
Ubicación: Queretaro Mexico
Mensajes: 73
Antigüedad: 12 años, 6 meses
Puntos: 1
bien pues yo lo que hago para centrar el documento sin tantos problemas es esto asta el momento me ah servido muxo
<html>
<head>
<title>CLAMP molde</title>
<link rel="STYLESHEET" type="text/css" href="estilos.css">
</head>
<body>
<center>
<div id="all">
contenidos
</div>
</center>
<body>
<html>

y listo asunto arreglado bueno ami si me ah funcionado asi que lo pongo para ver si les sirve
__________________
Sayounara
  #11 (permalink)  
Antiguo 09/05/2006, 19:27
Avatar de Mickel  
Fecha de Ingreso: mayo-2002
Ubicación: Lima, Peru
Mensajes: 4.619
Antigüedad: 15 años, 7 meses
Puntos: 7
se supone que no deberias usar <center>...
__________________
No tengo firma ahora... :(
  #12 (permalink)  
Antiguo 09/05/2006, 19:55
Avatar de Jesusguevarautomotri  
Fecha de Ingreso: enero-2006
Ubicación: Puerto Ordaz, Estado Bolivar
Mensajes: 106
Antigüedad: 11 años, 10 meses
Puntos: 0
Cita:
Iniciado por Mickel
se supone que no deberias usar <center>...
Pero tu lo usaste en: http://www.mickel.biz/centering.html Yo me estaba guiando por tu ejemplo y luego me dijeron que estaba mal, pienso que deberias hacer una enmienda.
__________________
jesusguevarautomotriz
Industria Automotriz de Venezuela - blog
Internet al dia - blog
  #13 (permalink)  
Antiguo 09/05/2006, 20:03
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
Recuperando el tema inicial:
SidP, tu css no funcionaba porque te contradecís:

Código:
body {
 margin-left : auto;
 margin-right : auto;
 margin:0px 0px 0px 0px;
 }
primero le decís que el margen se ajuste y después le decís que sea 0.....

sería mejor (y con el efecto deseado) dejar esas 3 líneas como:
Código:
body {
 margin : 0px;
 margin-left : auto;
 margin-right : auto;
 }
Por otro lado, Developer9, el valor de auto sirve para que el margen se ajuste automáticamente, la gracia de ponerle auto al margen derecho y al izquierdo es que se van a ajustar y van a quedar iguales, con lo que el elemento queda centrado (si tiene un ancho definido)

Y finalmente, Jesusguevarautomotri:
El elemento center fue desaprobado ya hace varios años, si bien puede seguir usándose sin problemas, la idea es sustituir todos los elementos que sean puramente estéticos (center, font, b, i, sub, sup, y muchos otros) por css. (bueno, en el caso de 'b' lo sustituye 'strong' y a 'i' lo sustituye 'em')


Saludos.
  #14 (permalink)  
Antiguo 09/05/2006, 20:09
Avatar de Hououji Ayumu  
Fecha de Ingreso: junio-2005
Ubicación: Queretaro Mexico
Mensajes: 73
Antigüedad: 12 años, 6 meses
Puntos: 1
mmm...

cito "Yo me estaba guiando por tu ejemplo y luego me dijeron que estaba mal"
pues la verdad no se porque te digan que esta mal ponerle <center> ya que yo lo eh usado asi y pues sip me funciona muy bien si quieres puedes ver la pagina donde lo use asi, (devo aclarar que es la primera page que hice con CSS)

http://mx.geocities.com/hououji_b/

aunque de cualquier manera si me estoy interesando por centrar con CSS eso de poner <center> es simplemente para que la pagina se vea sentrada cuando los visitantes tengan pantalla superior a 800 x 600 asi cada ves que entre alguien con pantalla superior a 800 x 600 pues la page queda centrada
__________________
Sayounara
  #15 (permalink)  
Antiguo 09/05/2006, 20:12
Avatar de Mickel  
Fecha de Ingreso: mayo-2002
Ubicación: Lima, Peru
Mensajes: 4.619
Antigüedad: 15 años, 7 meses
Puntos: 7
Cita:
Iniciado por Jesusguevarautomotri
Pero tu lo usaste en: http://www.mickel.biz/centering.html Yo me estaba guiando por tu ejemplo y luego me dijeron que estaba mal, pienso que deberias hacer una enmienda.
Pues... si... tengo que hacer una enmienda...

Gracias por aclararlo. Eso significa que al menos alguien leyo el articulo...
__________________
No tengo firma ahora... :(
  #16 (permalink)  
Antiguo 09/05/2006, 20:36
Avatar de Jesusguevarautomotri  
Fecha de Ingreso: enero-2006
Ubicación: Puerto Ordaz, Estado Bolivar
Mensajes: 106
Antigüedad: 11 años, 10 meses
Puntos: 0
Pues yo lo lei y me sirvio de mucho, contigo entendi y empece a usar CCS. Espero mas articulos tuyos, y me gustaria ver esa misma pagina centrada sin <CENTER>
__________________
jesusguevarautomotriz
Industria Automotriz de Venezuela - blog
Internet al dia - blog
  #17 (permalink)  
Antiguo 05/06/2008, 14:31
 
Fecha de Ingreso: junio-2008
Mensajes: 1
Antigüedad: 9 años, 6 meses
Puntos: 0
De acuerdo Respuesta: centrar body

Espero que os sirva, aunque el post tenga mucho tiempo...

centrar body sin usar <center>.


Código HTML:
Código:
 ...
<body>
       <div id="contenedor">

       </div>
</body>
</html>
Código CSS:
Código:
/*centramos todo el contenido del body*/
body{width:100%; text-align:center;}

/*volvemos a colocar todo a la izquierda*/
#contenedor{width:800px; height:600px; margin:auto; text-align:left;}
yo recomiendo usar un min-height:600px para que crezca si necesita crecer y en la hoja de estilos de IE6, usar height:600px (que hace lo mismo que min-height), pero para gustos los colores
Espero que os sirva. Un saludo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:55.