Baris Terakhir dijajar ke kiri dalam Grid Berpusat Elemen menggunakan Paparan Sebaris-Blok

Objektifnya adalah untuk mencipta grid berpusat blok sambil memastikan baris terakhir sejajar ke kiri. Tanpa menggunakan Flexbox atau menambah div pengisi tambahan, berikut ialah penyelesaian CSS sahaja:

Grid Adaptif menggunakan Display Inline-Block

<div>

margin:0;
padding:0;

}

bekas{

font-size:0;
margin:0 auto;
width:1000px;

}
.sekat {

font-size:20px;
width: 150px;
height: 150px;
margin:25px;
background: gold;
display:inline-block;

}

skrin@media dan (lebar maksimum: 430px) {

#container{
    width:200px;
}

}

skrin@media dan (lebar min: 431px) dan (lebar maksimum: 630px) {
#bekas{

    width:400px;
}

}
skrin @media dan (lebar min: 631px) dan (lebar maksimum: 830px) {
#bekas{

    width:600px;
}

}
@skrin media dan (lebar min: 831px) dan (lebar maksimum: 1030px) {
#bekas{

    width:800px;
}

}

<div>