JSFiddle - React, Tailwind, and code Playground

by evgkch

HTML

<div class="table">
  <div class="row">
    <div class="cell">Category</div>
    <div class="cell">Integrated Circuits (ICs)</div>
  </div>
  <div class="row">
    <div class="cell">Family</div>
    <div class="cell">Interface - Drivers, Receivers, Transceivers</div>
  </div>
  <div class="row">
    <div class="cell">Series</div>
    <div class="cell">-</div>
  </div>
  <div class="row">
    <div class=cell>Packaging</div>
    <div class="cell">Tape & Reel (TR)</div>
  </div>
  <div class="row">
    <div class="cell">Type</div>
    <div class="cell">Transceiver</div>
  </div>
  <div class="row">
    <div class="cell">Receiver Hysteresis</div>
    <div class="cell">500mV</div>
  </div>
  <div class="row">
    <div class="cell">Data Rate</div>
    <div class="cell">120Kbps</div>
  </div>
  <div class="row">
    <div class="cell">Voltage - Supply</div>
    <div class="cell">4.5 V ~ 5.5 V</div>
  </div>
  <div class="row">
    <div class="cell">Operating Temperature</div>
    <div class="cell">-40°C ~ 85°C</div>
  </div>
  <div class="row">
    <div class="cell">Package / Case</div>
    <div class="cell">16-SOIC (0.295", 7.50mm Width)</div>
  </div>


</div>

CSS

.table {
  display: table;
  width: 500px;
}
.row {
  display: table-row;
  width: 50%;
}

.cell {
  display: table-cell;
  border: 1px solid black;
}