Фосилаҳои амудӣ барои плиточка дар CSS

Акнун биёед фосилаҳои амудиро низ илова кунем. Барои ин ҳамаи фарзандонро margin-bottom дар қимати 10px таъин мекунем:

<div class="parent">
	<div class="child">1</div>
	<div class="child">2</div>
	<div class="child">3</div>
	<div class="child">4</div>
	<div class="child">5</div>
	<div class="child">6</div>
	<div class="child">7</div>
	<div class="child">8</div>
</div>

.parent {
	display: flex;
	flex-wrap: wrap;
	width: 320px;
	border: 1px solid red;
}
.child {
	box-sizing: border-box;
	width: 100px;
	height: 100px;
	margin-right: 10px;
	margin-bottom: 10px;
	border: 1px solid green;
}
.child:nth-child(3n) {
	margin-right: 0;
}

Чунон ки мебинем, ҳама чиз хуб кор мекунад, ҷуз он ки сафи охир аз волидайн фосила дорад. Аксаран ин муҳим нест.

Плиточкаеро бо ду унсур дар як саф бо фосилаи байни унсурҳои 20px созед.

Плиточкаеро бо се унсур дар як саф бо фосилаи байни унсурҳои 20px созед.

Плиточкаеро бо чор унсур дар як саф бо фосилаи байни унсурҳои 20px созед.