I am currently working on a tic-tac-toe game and I need help creating a grid layout similar to this example.
.grid-holder {
display: flex;
justify-content: center;
display: grid;
grid-template-columns: 100px 100px 100px;
grid-template-rows: 100px 100px 100px;
column-gap: 5px;
row-gap: 5px;
}
.grid {
border: 2px solid red;
text-align: center;
padding: 20px;
cursor: pointer;
}<div class="grid-holder">
<div class="grid">1</div>
<div class="grid">2</div>
<div class="grid">3</div>
<div class="grid">4</div>
<div class="grid">5</div>
<div class="grid">6</div>
<div class="grid">7</div>
<div class="grid">8</div>
<div class="grid">9</div>
</div>