JSFiddle - React, Tailwind, and code Playground

by Bohdan Doroshenko

HTML

<div class="row">
  <div class="col">
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis voluptates, eaque ab deserunt quasi molestiae tenetur provident consequatur. Harum blanditiis eius fugit ipsum impedit, voluptatum facere possimus assumenda consectetur optio.</div>
    <div>Aliquam temporibus quod, dolores autem eveniet laborum ipsum, maiores distinctio inventore fugit voluptatibus! Optio illo ipsum quibusdam voluptas eveniet, tempora nobis ut vitae possimus neque architecto aliquid accusantium nisi maxime?</div>
    <div>Non debitis minima error odit, voluptate ipsam quidem impedit accusamus ut soluta molestiae tempora, eius sit, placeat dicta a porro ducimus recusandae, sed praesentium voluptas. Pariatur, voluptatem reiciendis eaque ipsam.</div>
  </div>
  <div class="col">
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et obcaecati unde, sit vero facilis porro doloremque corporis tempora alias vitae at assumenda dolor atque mollitia sint aspernatur vel, iure nisi.</div>
    <div>Quasi veritatis, cumque minima explicabo necessitatibus unde laudantium voluptate earum similique, repudiandae voluptatum quidem. Quasi rerum laudantium esse sit sint illum, corporis dolorem ipsam perferendis non dicta eaque quas tempora!</div>
    <div>Modi ipsam nemo ullam necessitatibus pariatur, ex debitis dolore. Tenetur voluptatibus excepturi inventore eos, dignissimos rerum, praesentium deserunt enim eum reiciendis earum consequatur quod officiis. Autem rerum voluptatibus nobis cupiditate!</div>
  </div>
  <div class="col">
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus, consequuntur, quos. Error placeat iure, beatae nisi vel possimus adipisci corporis, quisquam, excepturi suscipit ipsam quia sit perspiciatis in omnis? Iusto?</div>
    <div>Dignissimos consequatur atque maxime iusto quod repellat, modi nulla quae perferendis suscipit. Repudiandae architecto officia, corporis illum, est ea numquam...

CSS

.row {
  display: flex; 
}

.row > .col:first-child {
  border-left: 1px solid black;  
}

.col {
  width: 100%;
  padding: 20px;
  border-color: black;
  border-width: 1px 1px 1px 0;
  border-style: solid;
}

@media (max-width: 400px) {
 .row {
    flex-direction: column;
 } 
}