JSFiddle - React, Tailwind, and code Playground

HTML

<section id="container">
    <div class="collection">1</div>
    <div class="collection">2</div>
    <div class="collection">3</div>
    <div class="collection">4</div>
    <div class="collection">5</div>
    <div class="collection">6</div>
    <div class="collection">7</div>
    <div class="collection">8</div>
    <div class="collection">9</div>
    <div class="collection">10</div>
    <div class="collection">11</div>
    <div class="collection">12</div>
    <div class="collection">13</div>
    <div class="collection">14</div>
</section>

CSS

#container {
    background-color: #EEE;
    width: 100%;
    height: 400px;
    -webkit-columns: 2 100px;
    -moz-columns: 2 100px;
    columns: 2 100px;
    -webkit-column-rule: 1px dotted #000;
    -moz-column-rule: 1px dotted #000;
    column-rule: 1px dotted #000;
}
.collection {
    width: 50px;
    height: 50px;
    background-color: white;
    border: 1px solid black;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 4px;
}