How to add different styles to last row of css grid layouts

Here is the simple way to add different styles for last row elements of css grid layout.

li:nth-child(Xn):nth-last-child(-n+Y) ~ li {
}

X is the no.of columns in the grid and Y is the (no.of columns+1)

For example, we have 3 column grid layout with border bottom for each grid item, and we don't want to border bottom for last row items.

li:nth-child(3n):nth-last-child(-n+4) ~ li {
    border-bottom: 0px;
}

Ex: 4 column grid layout

li:nth-child(4n):nth-last-child(-n+5) ~ li {
    border-bottom: 0px;
}

Ex: 5 column grid layout

li:nth-child(5n):nth-last-child(-n+6) ~ li {
    border-bottom: 0px;
}

Note: Above code will only work, if you have two or more than two rows.