Как сверстать это?

Question

[Денис Денисов]

Нужно сверстать блок как на картинке.

Вроде легко, но когда я делаю так:

<div class="container">
    <div class="img-container">
        <img src="...">
    </div>
    <h3 class="title">Пример</h3>
    <span class="author">Имя Фамилия</span>
</div>

.img-container {
    float:left
    width: 75px;
    height: 75px;
    margin-right: 10px;
}

получается это:


И я никак не могу сдвинуть имя и фамилию вниз. Что я делаю не так?

Answer 1

[Владимир Проскурин]

Верстка вдвойне легче, если она на флексбоксах.
jsfiddle.net/85kpemg1