Veremos con centrar una página Web con CSS, es algo simple pero puede sacar de apuro a varios derrepente algunos alguna vez habran pensado centrar con “float” pero si se ponen a buscar solo hay “left”,”right”,”inherit” y “none”.. Y se preguntaran donde esta el famoso “Center”.

Bueno ahora le daremos una solución fácil y compatible con varios navegadores y a diferentes resoluciones (no traten de usar margin-left o margin-right no les funcionará en todas las resoluciones)

Veamos el CSS:

body{
	/* margin-left y margin-right: auto; hacen que quede centrado */
	margin-left: auto;
	margin-right: auto;
	width: 600px; /* Aca ponemos el ancho exacto de nuestra pagina */
	}
#contenedor{
	background-color:#3cc;
	width:600px;
	height:500px;
	text-align:center;
	font-family:Verdana, Geneva, sans-serif;
	color: #366;
	}

Ahora el HTML:

<div id="contenedor">
	 Aca ira el contenido de la web xD!
</div>

Centrar en Internet Explorer

A veces (siendo buenos), internet explorer es un dolor de cabeza. Para poder centrar en internet explorer tenemos que agregar un par de líneas más para poder centrar con CSS.

body{
        margin: auto;
	width: 600px; 
        text-align:center; /* Hack para IE6 */
	}
#contenedor{
	background-color:#3cc;
	width:600px;
	height:500px;
	font-family:Verdana, Geneva, sans-serif;
	color: #366;
        text-align:left; /* Hack para IE6 */
	}

En conclusión, para internet explorer debemos centrar el texto del contenedor con “text-align:center” y alinear a la izquierda el texto del elemento a centrar.