JSFiddle - React, Tailwind, and code Playground

by skadudg_coolhuny

HTML

<div id="table">
  <div class="caption">MV ASIAN GLORY</div>
  <div class="row">
    <div class="cell">AOY</div>
    <div class="cell">2</div>
    <div class="cell">3</div>
  </div>
  <div class="row">
    <div class="cell">VOA</div>
    <div class="cell">5</div>
    <div class="cell">6</div>
  </div>
  <div class="row">
    <div class="cell">DAD</div>
    <div class="cell">8</div>
    <div class="cell">9</div>
  </div>
</div>

CSS

#table {
	    display: table;
	    width: 100%
	  }

	  .caption {
	    display: table-caption;
	    padding: 0.5em;
	    border: 1px solid #000;
	  }

	  .row {
	    display: table-row;
	  }

	  .cell {
	    display: table-cell;
	    padding: 0.5em;
	    border: 1px solid;
	  }