CSS Grid - responsive 3-column grid example

_grid.scss

.products-wrap {
    display: grid;
    justify-content: space-between;
    grid-template-columns: repeat(auto-fill, 100%);

    @include media( $screen--m ) {
        grid-template-columns: repeat(auto-fill, 48%);
        grid-gap: 2%;
    }

    @include media( $screen--l ) {
        grid-template-columns: repeat(auto-fill, 31%);
    }
}