JSFiddle - React, Tailwind, and code Playground

by Kamal Rawat

HTML

<div>
  <h2>
    My blog
  </h2>
</div>

<div>
  <div class="leftcolumn">
    <div class="card">
       <h2>Past Posts</h2>
      <span>07 JAN 2019 - (16)</span>
      <span>06 JAN 2019 - (26)</span>
      <span>05 JAN 2019 - (6)</span>
    </div>
  
  </div>
  <div class="rightcolumn">
    <div class="card"><span>TITLE HEADING</span><span class="date">6 Jan 2019</span><p>quia et suscipit
suscipit recusandae consequuntur expedita et cum
reprehenderit molestiae ut ut 
nostrum rerum est autem sunt rem eveniet  asdfasdfasd asfasdfasdfasdfasd fsa fasdfasdfasdfasfsadf</p></div>
  </div>
  
</div>

CSS

*{
  box-sizing: border-box;
}

body {
  font-family: Arial;
  padding: 20px;
  background: #f1f1f1;
}

.leftcolumn{
  float: left;
  width: 25%
}

.rightcolumn{
  float: right;
  width: 75%;
  padding-left: 20px;
}

.card {
   background-color: white;
   padding: 20px;
   margin-top: 20px;
}