http://jsfiddle.net/fQv97/
HTML
My text, should be align middle CSS
.table-cell { height: 200px; width: 200px; vertical-align: middle; background: #eee; display: table-cell; position: absolute; }
Problema
El texto debe colocarse en el medio de mi “celda de la tabla”. Todo funciona como se espera hasta que agregue “position: absolute”. Ahora no puede colocar mi contenido en el medio más? Por qué no? Todavía sabe mi altura y ancho porque lo configuré en mi CSS.
¿Alguna solución inteligente para esto?
Todo funciona como se espera hasta que agregue “position: absolute”. Ahora no puede colocar mi contenido en el medio más? Por qué no?
position: absolute display: block fuerzas position: absolute display: block , leer el número dos aquí .
En cuanto a una solución alternativa, creo que tendrá que envolverla en otro elemento:
My text, should be align middle .table-cell-wrapper { position: absolute; } .table-cell { height: 200px; width: 200px; vertical-align: middle; background: #eee; display: table-cell; }
Hay algunas soluciones que he descubierto para esto, como agregar un hash antes de la posición:
#position: absolute;
Ese truco se encontró aquí: centrado vertical en CSS
aquí está la solución:
My text, should be align middle