JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<div class="row">
  <div class="row__item">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt odio et eius vel fugit saepe quaerat eligendi sequi ducimus suscipit rerum voluptate illum, reiciendis, neque a quas amet qui quae.</p>
    <p>Sapiente error, adipisci dolore debitis neque libero praesentium ad quidem alias veniam atque ipsum dolorem, nesciunt impedit, ea sequi odio rerum. Ratione a aspernatur vel soluta, autem sequi, nihil explicabo.</p>
  </div>
  <div class="row__item">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut ad cumque asperiores neque quidem inventore illum.</p>
  </div>
  <div class="row__item">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas vero distinctio ducimus perferendis dolor minima atque aperiam suscipit nemo sint quae, temporibus assumenda incidunt inventore, ipsam, possimus reiciendis modi vel!</p>
    <p>Vel dolores beatae consequatur omnis assumenda magnam, quisquam aperiam optio ullam nam facilis exercitationem asperiores nostrum illo numquam illum molestiae dolore, doloribus quos nesciunt laboriosam amet accusamus qui architecto. Ullam.</p>
  </div>
  <div class="row__item">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum sequi, ratione voluptatem. Quidem praesentium quibusdam eveniet enim est repellat fugit iste rem voluptatum nesciunt. Praesentium sapiente eius labore quam sed!</p>
    <p>Voluptatum accusamus aliquid placeat odio doloribus blanditiis assumenda nihil excepturi ipsam</p>
  </div>
</div>

SCSS

.row {
  display: flex;
  flex-wrap: wrap;
  
  &__item {
    margin-left: 2rem;
  }
}