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

[prukon]

Добрый день.

Подскажите пожалуйста как мне выровнять блок с категориями https://yadi.sk/i/u1-b0bXx332nWw на сайте dvapilota.com

Убедиться в том, что блок с категориями не по центру можно взглянув на его расположение относительно заголовка ниже.

Сейчас я весь блок с меню поместил вот в такой div:

<div class="navbar" style="position:relative; width:80%; height:100%; text-align:center; margin: auto; outline:0px solid blue">

Но меню вы выровнялось по горизонтали.

[Вадим Мошев]

Чтобы выравнять блок по центру контейнера, надо:
1. Задать ему ширину (у вас есть)
2. Установить свойство margin в значение "0 auto" (а у вас просто auto)
И зачем у вас установлено абсолютное позиционирование для этого блока?

Теперь надо отрегулировать ширину блока, который вы центруете, чтобы он встал именно по центру.

[Вадим Мошев]

Кстати, есть ещё один вариант, пригодный для тех случаев, когда выравниваемый блок имеет неопределённую ширину, то есть, его ширина будет меняться в зависимости от содержимого. В таком случае задавать ширину такому блоку не надо, это верстать всё это надо следующим образом.

HTML:

<div class="containerForAlignedBlock">
	<div class="alignedBlock">
		<div class="someItem">Прыжки с парашютом</div>
		<div class="someItem">что-то ещё</div>
		<div class="someItem">и ещё...</div>
		<div class="someItem">таких позиций может оказаться сколько угодно</div>
	</div>
</div>

CSS:

.containerForAlignedBlock {
	text-align: center;
}

.alignedBlock {
	display: inline-block;
}

.someItem {
	/*этому стилю вы задаёте стиль самостоятельно в зависимости от того,
	как вы его хотите оформить*/
}