FAQ 50 PREGUNTA ¿Cómo alinear verticalmente un texto dentro de una capa?
RESPUESTA Lo que sigue...
Ejemplo típico/tópico de cabecera con imagen...
<div id="cabecera">
<img src="unaImagen" />
<div><span>Texto a centrar</span></div>
</div>
Esto estaría centrado hor. y verticalmente si en el archivo estilos.css tenemos...
#cabecera{
display:table;
...
}
#cabecera div{
display:table-cell;
/*de este modo podemos aprovechar las opciones de una celda
como por ejemplo vertical-align */
vertical-align:middle;
text-align:center;
}
Vale. Pero esto no se ve bien en el explorer ...
qué hacer?
Lo siguiente
#cabecera{
display:table;
...
}
#cabecera div{
_position: absolute;
_top: 50%;
display: table-cell;
vertical-align: middle;
text-align:center;
}
#cabecera span{
_position: relative;
_top: -50%;
}
Para saber más sobre esto podéis visitar los enlaces siguientes...
http://www.jakpsatweb.cz/css/css-ver...-solution.html http://wellstyled.com/css-underscore-hack.html
o en el foro...
http://www.forosdelweb.com/f4/capas-dreamweawer-205350/