JSFiddle - React, Tailwind, and code Playground

by Paul Leech

HTML

<div id="container">
  <div class="row">
<!--   <div class="col"> -->
    <img src="https://gaming.netcentrx.net/golf_rival/club_img/slices/Arrow.png" height="25" width="25"  />
  <!-- </div> -->
  <!-- <div class="col"> -->
    <a href="">asdf</a>
  <!-- </div> -->
  </div>
  <div class="row">
<!--   <div class="col"> -->
    <img src="https://gaming.netcentrx.net/golf_rival/club_img/slices/Arrow.png" height="25" width="25"  />
  <!-- </div> -->
  <!-- <div class="col"> -->
    <a href="">asdf</a>
  <!-- </div> -->
  </div>
</div>

CSS

#container {
  display: flex;
  width:250px;
}

#container .col {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  background: grey;
}
#container .row {
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  width: 100%;
}