Элемент центрального блока в элементе

Question

Я пытаюсь центрировать элемент блока (поле для надписи WordPress, включая изображение), но это не сработает. Я пробовал:

.imagecenter {
   margin-left: auto;
   margin-right: auto;
   display: block;
}

Но это просто не сработает. Я также попробовал margin-left: auto; margin-right: auto;, но это тоже не сработает. Что-то я делаю не так? Это то, что в документации W3C сказано, что я должен делать.

В HTML это выглядит так (уточнить):

<div id="content">
........post here......
<div class="wpcaption imagecenter" style="width:225px">
<img src="blah" />
Blah.
</div>
.........post here......
</div>

У меня нет контроля над шириной элемента. Это установлено пользователем. Пользователь хочет, чтобы div был центрирован. Это не работает. Я просмотрел документацию, но она все равно не работает.

РЕДАКТИРОВАТЬ: Я уже пробовал маржа слева: Авто и маржа право: Авто. ЭТО НЕ РАБОТАЕТ.

Answer 1

Как правило, чтобы расположить div в центре, нужно сделать так, чтобы левые и правые поля были автоматически, а затем задать ширину div:

.centerDiv
{
    margin-left:auto;
    margin-right:auto;
    width: XXX px;
}

Answer 2

Дайте ему ширину меньше ширины его родителя.

.parent    { }
.imgCenter { width:320px!important; margin:auto; }

<div class="parent">
  <img src="foobar.jpg" class="imgCenter" />
</div>

Answer 3

Я знаю, что это старый вопрос, но для тех, кто находит это в Google, я нашел другой ответ:

Просто передайте эти атрибуты элементу-обертке, и содержимое будет выровнено по центру.

width: 1024px; 
margin-left: auto;
/* I have used 1024px since I set the minimum resolution requirements for my website as 1024 x 768 */

Answer 4

Более простым решением может быть установка margin-left: auto, margin-right: auto и text-align: center (для текста заголовка) для всех дочерних элементов вашего содержащего элемента:

.imagecenter *{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

Это означает, что вам не нужно явно устанавливать ширину содержащего вас элемента, но есть недостаток, что текст заголовка будет иметь ширину 100%, что может выглядеть странно.