Вертикальное выравнивание блоков в CSS

Приветствую всех, хочу поделиться своим собственным методом центрирования блока по вертикали. Все наверно и так читали не мало статей как это сделать и я не говорю о каком-то абсолютно новом способе, потому что все браузеры не считая IE всегда отлично понимали простую конструкцию:

HTML:

<div>
   <p>
    Because the Welsh and Roman heritage was almost entirely erased by the invasion of low German and then Scandinavian populations….
   </p>
</div>

* This source code was highlighted with Source Code Highlighter.

CSS:

  div {
    display: table-cell;
    vertical-align: middle;
  }

* This source code was highlighted with Source Code Highlighter.

и по сути оставалось только научить IE (7 и ниже) делать тоже самое. Что привело к изобретению массу извратных способов: добавления expression'а, манипуляции с line-height, вставка пустого inline элемента после текста и т.д. Я так же придумал способ именно для IE используя для остальных браузеров код, который представлен выше. И так вот мой метод:

HTML:

<div class="b-width">
  <div class="b-valign-middle">
    <div>
      <p>
        собрался, настроился и без лишних сантиментов выиграл. Вообще как по мне - последняя игра немного странная. То ли terran Canata расслабился, то ли его противник понял, что нельзя разочаровывать фанатов, но никаких других слов кроме "пришёл и убил" я к этой игре подобрать не могу.
        собрался, настроился и без лишних сантиментов выиграл. Вообще как по мне - последняя игра немного странная. То ли terran Canata расслабился, то ли его противник понял, что нельзя разочаровывать фанатов, но никаких других слов кроме "пришёл и убил" я к этой игре подобрать не могу. Что касается второй пары - то тут я даже и не знаю, что сказать. Видимо, zerg EffOrt настолько сильно озабочен делами своей команды в SPL, что ничто другое его попросту не интересует. Не буду расписывать - посмотрите оба матча, ибо они отнюдь не длинные.</p>
    </div>
  </div>
</div>

* This source code was highlighted with Source Code Highlighter.

общий СSS:

.b-width {
  width: 40%;
  margin: 0 auto;
}

.b-valign-middle {
  height: 500px;
  border: 1px solid;
  position: relative;
  display: table-cell;
  vertical-align: middle;
}

  .b-valign-middle p {
    border: 1px solid red;
  }

* This source code was highlighted with Source Code Highlighter.

CSS для IE7 и ниже:

.b-valign-middle div {
  position: absolute;
  top: 50%;
}

  .b-valign-middle p {
    position: relative;
    top: -50%;
  }

* This source code was highlighted with Source Code Highlighter.

Пример реализации

Немного поясню: наш контейнер у которого мы указываем высоту это .b-valign-middle, внутри него нам нужно выровнять по центру контент неизвестного объема который мы заворачиваем в div и p(не очень хорошо с точки зрения семантики скажут многие, но оно того стоит). Первая обвертка — div нам нужна для того чтобы сместить начало контента к середине контейнера (top: 50%). А теперь самое интересное: вторая обвертка — p нужна для того чтобы поднять контент на 50% от высоты первой обвертки, для этого у div ставим position: absolute; (relative не сработает) и p top: -50%, вот и все! Довольно просто, не правда ли?
Причем этот метод работает только в IE, нормальные браузеры не поднимают p на 50% высоты div'а т.к высота у него не задана явно, а IE на этот раз приятно удивил!

Ну вот и все. Буду рад если кому-то пригодится этот метод, так же если я не первый кто его придумал прошу сильно не ругать, потому что я действительно его придумал сам. Проверял метод под браузерами: IE6+, Opera 9.6, FF3.5, Chrome, Safari3.