<div class="grid">
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
  <div class="column"></div>
</div>

html, body {
  height: 100%;
  margin: 0; padding: 0;
}

.grid {
  display: grid;
  grid-template-columns: 150px repeat(12, 1fr);
  grid-column-gap: 10px;
  background-color: rgba(255,0,0,.7);
  height: 100%;
}

.column {
  font-family: 'Output Sans', -apple-system, BlinkMacSystemFont, 
    "Segoe UI", "Roboto", "Oxygen", 
    "Ubuntu", "Cantarell", "Fira Sans", 
    "Droid Sans", "Helvetica Neue", sans-serif;
  color: white;
  text-transform: uppercase;
  font-size: 9px;
  background-color: rgba(0,0,0,.2);
  justify-content: center;
  align-items: center;
  display: flex;
}