Tutorial CSS : centrar un div dentro de otro

Centrar un div dentro de otro

Para centrar un <div> que se encuentra dentro de otro, deberemos definirlo con margin:0px auto (en el div hijo).

Sin embargo, para que funcione también en el navegador web Internet Explorer, deberemos definir text-align:center en el div padre.

Código HTML:

<html>
    <head>
        <title>Cursos gratis</title>
        <link rel="stylesheet" type="text/css" href="estilos.css" />
    </head>

    <body>
        <div id="divPadre">
            <div id="divHijo">Este div está dentro del otro</div>
        </div>
    </body>
</html>

Código CSS:

#divPadre {
    height:100px;
    width:800px;
    text-align:center;
    background-color:blue;
}

#divHijo {
    height:50px;
    width:400px;
    margin:0px auto;
    background-color:red;
}

Aquí puedes ver el resultado:

Centrar un div

Tutorial de CSS

Centrar un div dentro de otro