Tupale

Como centrar un div en la pagina con CSS

Generalmente resulta un poco difícil hacer toda una pagina con divs en especial cuando se esta pensando en varias columnas de contenidos, pero después de un tiempo y de algunos tips, se convierte en un proceso sencillo y aunque rutinario, muy creativo.

este es un simple tip o mini-tutorial para centrar tu web o crear un div centrado dentro del cual puedas trabajar, de manera que tu web siempre va a estar con un ancho fijo sin importar la resolución del monitor y siempre estará en el centro.

Primero debemos colocar este CSS:

body {
text-align:center;
}
#wrapper {
margin:0 auto 0 auto;
width:970px;
border:1px solid red;
text-align:left;
}
#logo {
width:214px;
height:48px;
background:#066;
border:1px solid red;
}

Le he colocado algunos bordes rojos y fondos para que al probar el ejemplo puedan notar que es lo que esta cambiando.
Y este seria el HTML.

<body>
<div id=”wrapper”>
<div id=”logo”></div>
<div id=”buscador”></div>
</div>
</body>

Eso es todo, de manera que dentro de su div “Wrapper” pueden maquetar todo su sitio y este se mantendrá centrado. xD

Deja un comentario

A %d blogueros les gusta esto: