Выравнивание блока div по центру 1

Пожалуй, самым простым и легким способом выровнять блок div по центру является использование свойства margin со значением margin-left:auto и margin-right:auto.

Самое важно условие, чтобы это начало работать, у блока div должна быть задана определенная ширина (в пикселях или процентах).

Больше моих уроков по HTML, CSS и верстке сайтов здесь.

Посмотрите, как это может выглядеть:

<div style="background: #ccc; width:300px; height:300px; margin:auto;">
Содержимое блока
</div>

Как вы понимаете, условие  margin-left:auto и margin-right:auto можно записать сокращенно:

margin:auto;

или

 margin:10px auto;

(получаем отсуп в 10 пикселей сверху и снизу и auto слева и справа).

Все это работает до тех пор, пока у блока задана ширина, если вы ее уберете, выравнивание сразу пропадет.

Таким образом, браузер, зная исходную ширину блока, может автоматически рассчитать такую величину отступов, чтобы блок встал ровно по центру.

Больше моих уроков по HTML, CSS и верстке сайтов здесь.