Centrer un div horizontalement ET verticalement

Vous connaissez tous bien sûr le célèbre margin : 0 auto; qui vous permet de centrer un élément de votre page, pour autant bien sûr que ce même élément dispose d'une largeur donnée. Cette simple ligne de code centrera votre div au milieu, mais comment faire pour centrer cet élément verticalement?

Si vous connaissez la hauteur et la largeur de votre box, utilisez ce code très simple:

#main
{
    position:absolute;
    background-color:#00FF00;
    width: X px ;
    height: Y px ;
    top:50%;
    left:50%;

    /*Diviser la largeur par deux ET mettre en négatif*/
    margin-left: -X/2 px;

    /*Diviser la hauteur par deux ET mettre en négatif*/
    margin-top: -Y/2 px;
}

Attention, veillez bien à remplacer les valeurs X et Y par la largeur et la hauteur de votre élément! Comme vous pouvez le voir dans les lignes 9 et 10, vous devez diviser ces valeurs en deux et les mettre en négatif. Ensuite, magie! Votre élément ce situera toujours au milieu de votre page, même en la redimensionnant ;)

CR