Как разбить текст на блоки?

Question

[Алексей]

В тексте картинки обтекаемые справа. Картинки по высоте больше текста. В итоге нижние картинки сдвигаются вправо и вверх и налазят на предыдущий абзац.
selftrips.ru/strany-i-mesta/europa/velikobritaniya...
Как сделать чтобы следующий абзац не налазил не предыдущий?
Пытаюсь обернуть в <div></div>не помогает.
Спасибо.

Answer 1

[Stalker_RED]

p {
  clear: both; /* magic! */
}
img {
  float: left;
  margin: .5em;
}

https://jsfiddle.net/hfedpdne/show/light

Comments

[Алексей]

А если между блоками должны быть " чистые заголовки"<h2></h2> Можно как то сделать?
https://jsfiddle.net/ysxfu131/

[Stalker_RED]

Алексей, и в чем проблема?

[Алексей]

Stalker_RED, заголовок подлазит в предыдущий блок (расширте окно результата)

[Алексей]

Stalker_RED, решил проблему добавив в заголовок <h2 clear: both;>
А можно как то решить без затрагивания кода заголовка?

[Stalker_RED]

Алексей,

h2 {
  clear: both; /* magic!!!!!!!!!!!!!!! */
}

[Алексей]

Stalker_RED, Это не решение в коде будет заголовок со стилем все равно

[Stalker_RED]

Алексей, float включает обтекание, clear - выключает.

Что значит "заголовок со стилем все равно"?

[Алексей]

хотелось бы чтобы в коде страницы выглядело так<h2>xxxx</h2>

[Stalker_RED]

Алексей, и что вам мешает? Это сюр какой-то... У вас довольно сложный сайт, с кучей контента, и вы вот только сейчас с удивлением узнаете, что можно не инлайнить стили а писать их в xxxx.css файлы?