Есть блок разбитый на 2 столбца. Как сделать так, чтобы весь текст начинался сразу под заголовком в первом столбце, а дальше плавно перетекал в правый при различном объеме текста. Т.е. начало это "текст рыба", а его продолжение в "продолжение текста" и чтобы он бы неделимый. Блок должен сохранять адаптивность и выходить за пределы блока не должен.
Можно ли это реализовать с помощью только стилей или без скриптов никак не обойтись?
.percent50 {
width:50%;
display: inline-block;
vertical-align: top;
}
<div>
<div class="percent50">
<img src="http://placehold.it/180x135/" />
<h1>Заголовок</h1>
<p>текст рыба</p>
</div><div class="percent50">
<p>продолжение текста</p>
</div></div>