<div class="wrapper">
        <div class="first-box">
            <h2> Box 1</h2>
        </div>

        <div class="second-box">
            <h2> Box 2</h2>
        </div>

        <div class="third-box">
            <h2> Box 3</h2>
        </div>

        <div class="fourth-box">
            <h2> Box 4</h2>
        </div>
        <div class="fifth-box">
            <h2> Box 5</h2>
        </div>
        <div class="sixth-box">
            <h2> Box 6</h2>
        </div>
    </div>
.wrapper{
    display:grid;
    background-color: darkgrey;
    border-style: solid;
    border-color: black;
    border-width: 1.5px;
}
.first-box{
    border: solid 1px black;
    background-color:  aqua;
    padding: 10px;
    text-align: center;

}

.second-box{
    border: solid 1px black;
    background-color: cyan;
    padding: 10px;
    text-align: center;

}

.third-box{
    border: solid 1px black;
    background-color: lightcyan;
    padding: 10px;
    text-align: center;

}

.fourth-box{
    border: solid 1px black;
    background-color: paleturquoise;
    padding: 10px;
    text-align: center;

}

.fifth-box{
    border: solid 1px black;
    background-color: aquamarine;
    padding: 10px;
    text-align: center;

}

.sixth-box{
    border: solid 1px black;
    background-color: turquoise;
    padding: 10px;
    text-align: center;

}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.