<h2>Example for grid-column-end Property</h2>
<div class="grid-container">
<div class="items item1">1</div>
<div class="items">2</div>
<div class="items">3</div>
<div class="items">4</div>
<div class="items">5</div>
<div class="items">6</div>
</div>
.item1 {
grid-column-end: span 3;
}
.grid-container {
width: 500px;
height: 300px;
display: grid;
grid-template: auto auto auto / auto auto auto;
background-color: #02B290;
border: 1px solid #808080;
}
.items {
background-color: #758283;
margin:10px 10px;
padding: 20px;
font-size: 20px;
text-align: center;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.