<div class="boards-container">
    <div class="boards-container__board"><h1>Board One</h1></div>
    <div class="boards-container__board"><h1>Board Two</h1></div>
    <div class="boards-container__board"><h1>Board Three</h1></div>
    <div class="boards-container__board"><h1>Board Four</h1></div>
    <div class="boards-container__board"><h1>Board Five</h1></div>
    <div class="boards-container__board"><h1>Board Six</h1></div>
    <div class="boards-container__board"><h1>Board Seven</h1></div>
    <div class="boards-container__board"><h1>Board Eight</h1></div>
    <div class="boards-container__board"><h1>Board Nine</h1></div>
    <div class="boards-container__board"><h1>Board Ten</h1></div>
  </div>
.boards-container {
  display: grid;
  grid-auto-columns: 272px;
  grid-auto-flow: column;
  grid-gap: 8px;
  height: 100vh;
  overflow: auto;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.