Mozilla se pasa por el forro el text-align: center;

Wakkos · #1 (**permalink**) 11/07/2008, 07:28

Tengo el siguiente código:

Código:

	BODY {
		background-color: #400C04;
		background-image : url(imagenes/bgbody.jpg);
		text-align: center;
		
	}
	div.contenido {
	width : 800px;
	background-color: #1a1919;
	border-bottom: 2px solid #2a2a2a;
	border-top: 2px solid #2a2a2a;
	padding: 0px;
	text-align: center;
	background-image : url(imagenes/bgcenter.gif);
	
	}
	div.central {
	width : 750px;
	background-color: #c7c094;
	padding: 0px;
	background-image : url(imagenes/bg.jpg);
	
	}

Algo simple...

Al utilizarlo, no me centra la capa 'contenido' en Mozilla, pero si en IE. Y la verdad no tengo ni puta idea, he probado varias cosas, pero no furula y no se porque, alguien me dice donde toy metiendo la pata?

Acias =)

P.D.: Ah, el HTML va así:

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Untitled</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
HEADER
<div class="contenido">

	<div class="central">
	HOLA HOLITAA
	</div>

</div>


</body>
</html>

Anarninquë · #2 (**permalink**) 11/07/2008, 07:32

Si lo que quieres es que te centre el "HOLA HOLITAA", debes poner el text-align:center; en la capa div.central

Prueba eso y me dices

Wakkos · #3 (**permalink**) 11/07/2008, 07:34

No, quiero que me centre la capa "contenido" ya que dentro de ella, el contenido va alineado a la izquierda.

Mikmoro · #4 (**permalink**) 11/07/2008, 07:34

Con text-align se alinearán los elementos que sean de texto, no de bloque (más que nada por lo de "text"

)

Debería funcionar añadiendo un margin auto a ese selector:

div.contenido {
width : 800px;
background-color: #1a1919;
border-bottom: 2px solid #2a2a2a;
border-top: 2px solid #2a2a2a;
padding: 0px;
text-align: center;
background-image : url(imagenes/bgcenter.gif);
margin: 0 auto;
}

Mikel.

Anarninquë · #5 (**permalink**) 11/07/2008, 07:36

Mikmoro, quiza me equivoque, pero el margin:0 auto; debería agregarse a la capa div.central que es la que se desea centrar, no?

Wakkos · #6 (**permalink**) 11/07/2008, 07:36

Olé! Me imaginaba que tendría que ver con los márgenes, pero al funcionar en IE y no en Shit-Zilla no intenté cambios por ese lado, ahora si funciona, gracias mil =)

Edit: no, es la capa Contenido la que quería centrar Anarninquë. Funciona perfecto con el margin: 0 auto.

Mikmoro · #7 (**permalink**) 11/07/2008, 09:19

Cita:

Iniciado por Anarninquë

Mikmoro, quiza me equivoque, pero el margin:0 auto; debería agregarse a la capa div.central que es la que se desea centrar, no?

Como bien ha puntualizado Wakkos, decía esto:

Cita:

Al utilizarlo, no me centra la capa 'contenido'

por eso estaba claro que quería centrar la caja contenido.

Mikel.

Anarninquë · #8 (**permalink**) 11/07/2008, 09:32

Vale, como originalmente había puesto text-align:center; en la capa contenido, di por sentado que lo que quería centrar era lo que había dentro de la capa contenido, o sea: div.central

Un saludo.

Mikmoro · #9 (**permalink**) 11/07/2008, 09:41

Yo también lo pensé por un momento, pero también había puesto el text-align en el body:

Cita:

BODY {
background-color: #400C04;
background-image : url(imagenes/bgbody.jpg);
text-align: center;
}

Mikel.