Как выровнять блок по вертикали?

Question

[DrunkMaster]

Демка https://jsfiddle.net/15m3m8cp/
HTML

<div class="main">
    <div class="left"><img src="..." width="100px" height="100px"></div>
    <div class="rigth">текст</div>
</div>

<br><br>

<div class="main">
    <div class="left"><img src="..." width="100px" height="100px"></div>
    <div class="rigth">
      текст<br>текст<br>текст<br>текст<br>текст<br>
      текст<br>текст<br>текст<br>текст<br>текст<br>
    </div>
</div>

Смысл в том, что внутри блока main есть 2 div блока рядом и контента может быть больше то в одном то в другом, как сделать что бы при любом варианте они вертикально выравнивались по верху? (главное контент в них, сами блоки не обязательно, рамки для наглядности)

Answer 1

[Сергей delphinpro]

Элементарно
https://jsfiddle.net/15m3m8cp/1/

Comments

[DrunkMaster]

Спасибо, помогло. А как лучше сделать что бы текстовый контент не соскакивал под картинку если его чуть больше. https://jsfiddle.net/15m3m8cp/2/ ведь он может просто перенестись на новые строчки и всё и так же остаться справа...

[Сергей delphinpro]

DrunkMaster: https://jsfiddle.net/15m3m8cp/3/