JSFiddle - React, Tailwind, and code Playground

HTML

<div class="megakrut">
                    <div class="content">
                        <div class="image">
                            <img src="http://placehold.it/200x200">
                        </div>
                        <div class="post">
                            <h1><a href="#">Почему разновозрастно плато?</a></h1>

            <p class="authors">Фамилия Автора</p>
            <p>Лакколит подпитывает водоносный этаж, за счет чего увеличивается мощность коры под многими хребтами. Застываение лавы обрывисто стягивает плоскостной плюмаж, делая этот типологический таксон районирования носителем важнейших инженерно-геологических характеристик природных условий. Регрессия остаточно намагничена. Платформа несет в себе лимнический афтершок, образуя на границе с Западно-Карельским поднятием своеобразную систему грабенов. Кальдера оседания, либо из самой плиты, либо из астеносферы под ней, увлажнена. Риолит, но если принять для простоты некоторые докущения, покрывает дрейф континентов, что позволяет проследить соответствующий денудационный уровень.</p>
            <p class="readmore"><a href="#">Читать далее</a> &rarr;</p>
                            </div>
                    </div>
                    <div class="mozaic">
                        <img src="http://placehold.it/133x89">
                        <img src="http://placehold.it/133x89">
                        <img src="http://placehold.it/133x89">
                        <img src="http://placehold.it/133x89">
                        <img src="http://placehold.it/133x89" style="margin-right: 0;">
                    </div>
                    <div class="about"><a href="#">Раздел</a>  <b>|</b>  <a href="#">Страна</a>  <b>|</b> 22 сентября 2013 <b>|</b> Комментарии: 0</div>
                </div>

CSS

.megakrut {
    border: 1px solid #DDD;
    margin-bottom: 20px;
    border-collapse: collapse;
    empty-cells: show;
    background: #EEE;
    width: 733px;
}
.megakrut .mozaic {
    padding: 0 10px 10px 10px;
    vertical-align: top;
    overflow: hidden;
    text-align: left;
    clear: both;
}
.megakrut .mozaic img {
    border-radius: 5px;
    width: 134px;
    margin-right: 5px;
}
.megakrut h1 {
    margin: 0;
    padding: 0;
    line-height: 100%;
    color: blue;
}
.megakrut p {
    margin: 10px 0;
    padding: 0;
}
.megakrut p.authors {
    font-weight: bold;
    color: red;
}
.megakrut .about {
    background: #DDD;
    padding: 5px;
    color: #555;
    text-align: right;
    font-size: .9em;
}
.megakrut .about b {
    font-weight: normal;
    padding: 0 5px 0 5px;
}

.content {
    padding: 10px 10px 0 10px;
    float: left;
}
.image {
    vertical-align: middle;
    float: left;
}
.image img {
    border-radius: 5px;
}
.post {
    margin-left: 220px;
}