JSFiddle - React, Tailwind, and code Playground

by Ishank Dubey

HTML

<ul>
<li>
  <div style='display:flex;text-align:left;'>
  <p >Code</p>
  <p style='text-align:right'>Date</p>
  </div>
  <div style='display:flex;text-align:left;'>
  <p>Code</p>
  <p>Location</p>
  <p>QTY</p>
  <p>Date</p>
  </div>
  <div style='display:flex;text-align:left;'>
  <p>Code</p>
  <p>Location</p>
  <p>QTY</p>
  <p>Date</p>
  </div>
</li>
<li>test</li>
</ul>

CSS

ul, li{
  table-layout:none;
  display:block;
  padding:0;
  margin:0;
}
li{
  
}
li  div{
  flex:auto;
}

p{
  flex:auto;
  padding:0;
  margin:0;
}