Как правильно использовать тег <img> и p:first-letter

[Vitaliy S]

Проблема в том если писать 1. <p><img> текст</p> то стиль p:first-letter не работает (не отображается в браузере).

Если писать так:

2.

<p><img></p>

<p>текст</p>

или

3.

<img>

<p>текст</p>

То свойство p:first-letter отлично отображается:

Но правильны ли последние 2 варианта с точки HTML? и СЕО для самих картинок.

[ablay2009]

Просто картинки являются инлайн элементами, поэтому first-letter принимает их за буквы.

[Vitaliy S]

Просто картинки являются инлайн элементами, поэтому first-letter принимает их за буквы.

Значить надо вынести элемен, как это правильно будет сделать?. Или оба варианта верны?

<div>

<img>

<p></p>

<p></p>

<p></p>

</div>

или

<div>

<p><img></p>

<p></p>

<p></p>

</div>

Edited April 19, 2012 by Vitaliy S

[SelenIT]

Вообще-то все варианты так себе. В чем конечная задача? Может, <img> тут просто не нужен?

[Vitaliy S]

Вообще-то все варианты так себе. В чем конечная задача? Может, <img> тут просто не нужен?

Конечная задача чтобы p:first-letter работал во всех абзацах статьи, а так как статья содержит от 1 до 4 картинок, то нужно вставить картинки без нарушений HTML, пока сделал так - <p><img style="" title="" alt="" height="" width="" src="" /></p>, что бы отступ картинки от TOPа не отличался от текста.

Самое интересное, если написать так <p class=""><img></p>, то картинка не воспринимается как инлайн элемент.

Edited April 19, 2012 by Vitaliy S