## Центрування в CSS - забава для всіх!

Данная статья является переводом вот этой статьи

Перевод - greencoma

Як ви центруєте частину сторінку, використовуючи CSS? Існує два основні способи й вибір завіст від того, використовуєте ви гумовий або фіксований дизайн.

### Центрування блоків із плаваючою шириною

Щоб отцентрировать блок із плаваючою шириною досить виставити бічні зовнішні відступи (margin) для блоку в пикселях або відсотках.

    div#container
    {
    	margin-left: 10%;
    	margin-right: 10%;
    }

### Центрування блоків з фіксованою шириною

Теоретично, для центрування блоку фіксованої ширини досить визначити бічні зовнішні відступи як auto

    div#container {
    margin-left:auto;
    margin-right:auto;
    width:50em;
    }

На жаль не у всіх браузерах блок буде розташовуватися по центру використовую цей метод. ДО таких браузерів ставляться:

So why not add Netscape 2 to your browser detect? Because it doesn't solve anything.

    NN4 (Mac and Win)
    Win/IE4>
    Win/IE5
    Win/IE5.5
    Win/IE6 (при включеному quirks-mode)

Якщо додати два прості правила, ця проблема може бути вирішена у всіх згадані вище браузерах, крім NN4.

### 1. Центрування контейнера body

Якщо браузери ігнорують бічні відступи встановлені як auto, то завдяки правилу text-align: center для контейнера body уміст буде розташовуватися по центру.

    body {
    text-align:center;
    }
    div#container {
    margin-left:auto;
    margin-right:auto;
    width:50em;
    }

### 2. Скидання властивості text-align

    body {
    text-align:center;
    }
    div#container {
    margin-left:auto;
    margin-right:auto;
    width:50em;
    text-align:left;
    }

Valid XHTML 1.0