JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
   <div id="header">Рецепты от Миранды</div>
   <div id="content">
    <h2>Рома!</h2>
    <p>Очистить от ядрышек 2 кг. грецких орехов. Растолочь скорлупу и смешать с фруктами
    в 2 литрах рома. Употреблять 3–4 раза в день.</p>
    <h2>Кровавая Мери</h2>
    <p>Влить в бокал хорошую 100% кровь по лезвию ножа. Влить водку &laquo;Смирновскую&raquo;.
    Пить залпом.</p>
    <h2>Грог по-рыбацки</h2>
    <p>1 рыбу залить кипятком, через 5 минут процедить и добавить грога. Подавать в чашках.</p>
    <h2>Хвангур</h2>
    <p>Сварить на медленном огне воду. Добавить в нее хлива и хрольва. Довести до кипения.</p>
    <h2>Царская водка</h2>
    <p>Смешать 2 части соляной кислоты и 1 часть азотной со льдом. Слить охлажденную смесь 
    в фужер. Пить залпом.</p>
    <h2>HotDog</h2>
    <p>Тщательно промойте косточки и сварите из них бульон. Подавать горячим.</p>
    <h2>Fireball</h2>
    <p>В большой бокал положить лед, вылить на него все компоненты и положить кружок лимона.</p>
   </div>
   <div id="sidebar">
    <p><a href="popular.html">Популярные рецепты</a></p>
    <p><a href="day.html">Рецепт дня</a></p>
    <p><a href="apple.html">Рецепты на основе яблок</a></p>
    <p><a href="ice.html">Рецепты на основе льда</a></p>
    <p><a href="hliv.html">Рецепты из хлива и хрольва</a></p>
   </div>
   <div class="clear"></div>
   <div id="footer">&copy; Влад Мержевич</div>
  </div>

CSS

body {
    font: 10pt Arial, Helvetica, sans-serif; /* Шрифт на веб-странице */
    background: #54463d; /* Цвет фона */
    margin: 0; /* Убираем отступы */
   }
   h2 {
    font-size: 1.1em; /* Размер шрифта */
    color: #752641; /* Цвет текста */
    margin-bottom: 0; /* Отступ снизу */
   }
   #container {
    width: 500px; /* Ширина макета */
    margin: 0 auto; /* Выравниваем по центру */
    background: #f0f0f0; /* Цвет фона правой колонки */ 
   }
   #header {
    background: #8fa09b; /* Цвет фона */
    font-size: 24pt; /* Размер текста */
    font-weight: bold; /* Жирное начертание */
    color: #edeed5; /* Цвет текста */
    padding: 5px; /* Отступы вокруг текста */
   }
   #content {
    float: left; /* Обтекание по правому краю */
    width: 329px; /* Ширина левой колонки */
    padding: 10px; /* Поля вокруг текста */
    border-right: 1px dashed #183533; /* Линия справа */
    background: #fff; /* Цвет фона левой колонки */
   }
   #content p {
    margin-top: 0.3em /* Отступ сверху */
   }
   #sidebar {
    float: left; /* Обтекание по правому краю */
    width: 120px; /* Ширина */
    padding: 10px; /* Отступы вокруг текста */
    background: #dedede;
   }
   #footer {
    background: #8fa09b; /* Цвет фона */
    color: #fff; /* Цвет текста */
    padding: 5px; /* Отступы вокруг текста */
   }
   .clear { 
    clear: both; /* Отмена обтекания */ 
   }