Проблема с вертикальным выравниванием: среднее;

Question

Как div sub устанавливает div center в среднее значение? Текст может быть другим, поэтому поле или высота строки в этой ситуации не являются хорошим решением.

CSS:

.center {
    background-color: #336699;
    width: 200px;
    height: 200px;
}

.sub {
    display: inline-block;
    vertical-align: middle;
}

HTML:

<div class="center">
    <span class="sub">
        Some text text...
    </span>
</div>

Answer 1

Возможное решение:

HTML

<div class="center">
    <span class="sub">
        Some text text...<br />
        An some more text...
    </span>
</div>

CSS

.center
 {
     background-color: #336699;
     width: 200px;
     height: 200px;
     display: table;
 }

.sub
 {
     display: table-cell ;
     vertical-align: middle;
     text-align: center;
 }

Живая демоверсия, если необходимо, находится на http://jsfiddle.net/vladsaling/6nTGF/.