JSFiddle - React, Tailwind, and code Playground

HTML

<div class="paragraph">
    <div class="note"></div>
    <div class="text">
    Основной текст размером 14px. Могущественный король Лир,  почувствовав приближение старости,  решает переложить бремя власти на плечи трех дочерей: Гонерильи,  Реганы и Корделии,  поделив между ними свое царство.
    </div>
</div>
<div class="paragraph">
    <div class="note">
        Примечание с размером текста 10px.
    </div>
    <div class="text">
    Король хочет услышать от дочерей,  как они его любят, «чтоб при разделе могли мы нашу щедрость проявить».
    </div>
</div>
<div class="paragraph">
    <div class="note"></div>
    <div class="text">
    Основной текст размером 14px. Могущественный король Лир,  почувствовав приближение старости,  решает переложить бремя власти на плечи трех дочерей: Гонерильи,  Реганы и Корделии,  поделив между ними свое царство.
    </div>
</div>
<div class="paragraph">
    <div class="note">
        Примечание с размером текста 10px.
    </div>
    <div class="text">
    Король хочет услышать от дочерей,  как они его любят, «чтоб при разделе могли мы нашу щедрость проявить».
    </div>
</div>

CSS

body {margin: 10px;}
.paragraph {
    font-size: 14px;
    font-family: "Trebuchet MS";
    padding-bottom: 10px;
    /*background: yellow;*/
}
.note {
    float: left;
    width: 100px;
    font-size: 10px;
}
.text {
    margin-left: 110px;
}