Core Code
Core Code Modern Dev Handbook

Grid Columns

Define columns using grid-template-columns.

Preview

Code

<style>
.container{
display:grid;
grid-template-columns:150px 150px 150px;
gap:10px;
}

.item{
background:#22c55e;
color:white;
padding:20px;
}
</style>

<div class="container">
<div class="item">A</div>
<div class="item">B</div>
<div class="item">C</div>
</div>

More Grid Intro Examples (8)

example Basic Grid Container open example example Grid Rows open example example Grid Gap open example example Basic Grid Placement open example example Repeat Columns open example example Simple Grid Layout open example example Grid Image Gallery open example example Grid Centering open example