<div class="wrapper">
        <div class="a">A</div>
        <div class="b">B</div>
        <div class="c">C</div>
        <div class="d">D</div>
        <div class="e">E</div>
        <div class="f">F</div>
        <div class="g">G</div>
    </div>

.wrapper{
    width: 600px;
    height: 600px;
    /* background-color: rgb(233,30,99); */
    background-color: #000;
    grid-gap: 10px;
    display: grid;
}
div{
    border: 1px solid black;
    background-color: white;

    text-align: center;
    font-weight:bold
}
.a{
    grid-row: ;
    grid-column: ;

}
.b{
    grid-row: ;
    grid-column: ;
}
.c{
    grid-row: ;
    grid-column: ;
}
.d{
    grid-row: ;
    grid-column: ;
}
.e{
    grid-row: ;
    grid-column: ;
}
.f{
    grid-row: ;
    grid-column: ;
}
.g{
    grid-row: ;
    grid-column: ;
}