Выравнивание изображения и текста по центру

[gadjet]

<p class="forimg">
<img src="img/image1.jpg">
<div class="textimg">текст текст текст текст</div>
</p>

В стилях

p.forimg {
display: inline;
text-align: center;
}
.textimg {
background: #e1e2e6;
color: #000000;
font-size: 14px;
width: 580px;
padding: 10px;
}

Нужно выровнять изображение с текстом под ним, по центру

Если в стилях убираю строку (display: inline;) то выравнивание происходит, но текст смещается вниз

Как сделать так чтобы и выравнивание происходило и текст прилегал к изображению?

[npofopr]

А с какой целью вы делаете его инлайновым?

Вообще это проще делать так (наверно):

<div style="width:600px; margin: 0 auto;">
<img src="img/image1.jpg">
text text text
</div>

Отцентровывать картинку с текстом плохое решение, текст лучше делать под фотографией. Ну или отцентровывать картинки, а текст через позиционирования рядом размещать.

[Switch74]

1. display: inline; - если вы так делаете, то в этот элемент не стоит пихать блочный элемент ибо в строчные блочные не суют

2. <p> предназначен для оформления текста, и <div> в него не попадает, а у <p> - по умолчанию есть отступы, вот ваш текст в <div> и слетает так далеко.

выход:

убираем display: inline;

<div> меняем на <span> или пытаемся его сделать строчным

[gadjet]

Получилось сделать как посоветовал npofopr

Способ Switch74 не подошел потому что текст расположен в блоке с фоном, после замены div на span блок уменьшается до размера строки.

Никак не могу разобраться как плюсануть тому кто помог разобраться в вопросе? Форумом вообще это предусмотрено?

[Switch74]

а добавить span в стили display:inline-block;

кста, если у вас текст в блоке с фоном а в примере npofopr этого блока нет, куда вы этот фон повесили?

[gadjet]

кста, если у вас текст в блоке с фоном а в примере npofopr этого блока нет, куда вы этот фон повесили?

Я оставил все по прежнему, только убрал display:inline; а в том что был блочным прописал margin: 0 auto;

Вообще способов всегда несколько.