The CSS row-gap property defines the space between the grid rows.
Syntax:
row-gap: length|normal;length – a defined length or % that will set the space between the rows.
normal (default) – defines a normal space between the rows.
Example:
<!DOCTYPE html>
<html>
<head>
<style>
.grid-container {
display: grid;
row-gap: 20px;
}
.grid-container > div {
border: 1px solid #333;
background-color: #e9c46a;
}
</style>
</head>
<body>
<div class="grid-container">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
</body>
</html>Output:
1
2
3
4
Enjoy coding!
Read also:
CSS grid-auto-columns Property