Simulamos mediante CSS, a una serie de capas como tablas HTML o celdas de tabla, con esto lograremos que el navegador vea a divs como tablas y se pueda utilizar la propiedad vertical-align en ellas.
Hay que tener en cuenta que las tablas CSS no son lo mismo que table HTML.
Implementacion:
HTML
[code lang=”html”]
<div id=”contenedor”>
<div id=”children”>CONTENIDO QUE SE VA A CENTRAR VERTICALMENTE</div>
</div>
[/code]
CSS
[code lang=”css”]
#contenedor {
display: table;
height:300px;
}
#children {
display: table-cell;
vertical-align: middle;
}
[/code]
Con eso funciona perfectamente.