JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu">
  <span class="block">
    <a href="#" class="header">header1</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
  </span>
  <span class="block">
    <a href="#" class="header">header2</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
  </span>
  <span class="block">
    <a href="#" class="header">header3</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
  </span>
  <span class="block">
    <a href="#" class="header">header4</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
  </span>
  <span class="block">
    <a href="#" class="header">header5</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
    <a href="#">link</a>
  </span>
</div>

CSS

.block{display:inline-block;width:30%;vertical-align:top;}
.header{font-weight:bold;text-transform:uppercase;}
.menu a{display:block;}
@media all and (max-width: 500px){
  .block{width:100%;}
}