Ячейка таблицы с вертикальным выравниванием не работает с абсолютной позицией

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;
}

Проблема

Текст должен быть помещен в середину моей «ячейки таблицы». Все работает, как ожидалось, пока я не добавлю «position: absolute». Теперь он больше не может размещать мой контент посередине? Почему нет? Он по-прежнему знает мою высоту и ширину, потому что я установил их в своем CSS.

Есть ли способ обхода этой проблемы?

25
задан Brian Tompsett - 汤莱恩 6 July 2017 в 19:50
поделиться