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 විය යුතුය.