Вирівнювання div по центру

Верстаючи сайт, я думаю, кожен не раз зустрічався з проблемою вирівнювання div контейнера, або будь-якого іншого елемента по центру. У цьому пості я хочу розповісти пару способів, як вирівняти елемент по центру по горизонталі і одночасно по горизонталі і вертикалі.
Багато застосовують для батьківського елемента css властивість

Це призводить до вирівнювання по центру тільки в моєму "улюбленому" IE. В інших же браузерах це властивість працює тільки для малих елементів, яким div не є. Почнемо.

Горизонтальне вирівнювання за допомогою CSS.

Щоб вирівняти контейнер по центру по горизонталі, потрібно задати його ширину, а так же, встановити margin зліва і справа в auto. Цей метод працює для блокових елементів (контейнери, параграфи, і тд). Щоб він працював і для малих елементів, таких як посилання і зображення, потрібно застосувати властивість display: block.

Тоді код буде виглядати так:

Вирівнюємо блок по центру одночасно по горизонталі і вертикалі.

Тут все трохи складніше. Для початку, потрібно знати як ширину, так і висоту вирівнюється елемента. Встановивши властивості left і top рівними 50% ми розташували верхній лівий кут нашого елемента по центру батьківського елемента (так як задано властивість position: relative). Тепер потрібно зрушити наш елемент наліво - на половину ширини і наверх - на половину висоти, щоб зрушити його на потрібну позицію. Якщо виникне необхідність розмістити елемент по центру екрана, то потрібно замінити

P.S. На блозі blognat.ru проводиться акція. огляд кожному бажаючому.