Потоки предметов горизонтально с выравниванием по центру внутри контейнера - PullRequest
0 голосов
/ 12 января 2011

Моя дилемма заключается в следующем (и я должен быть прост, я подозреваю): у меня есть контейнер и набор предметов (оба элемента div).Применяется следующий CSS:

.container {
    float:          left;
    width:          100%;
}


.item {
    margin:         32px;
    text-align:     center;
    position:       relative;
    float:          left;
}

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

Ответы [ 3 ]

1 голос
/ 12 января 2011

редактировать
Измените .item { display: block; } на .item { display: inline-block; }, уберите .item { float:left; } и добавьте text-align: center; к .container

Вы можете увидеть это здесь: http://jsfiddle.net/JMC_Creative/RQrRb/

Вы можете также поставить .inner div с width:75%; margin: 0 auto;, а затем поместить .item s в , что , если вы хотите иметь место по бокам.

0 голосов
/ 12 января 2011

.container {width: 100%;}

.item {margin: 32px;text-align: center;}

0 голосов
/ 12 января 2011

Вам захочется взглянуть на этот урок от Mozilla.Его можно выровнять по центру, просто установив для родительского контейнера значение text-align:center;

Кросс-браузерный встроенный блок

...