Блоқи унсурҳоро дар CSS дар як хат қарор додан

Хосияти margin на танҳо барои додани фосилаҳо, балки барои марказонидани блоқи унсурҳо низ истифода мешавад. Барои ин фосилаи ростро ва чапро ба қимати auto додан лозим.

Дар мисоли зер блоқи дохилӣ дар марказ ҷойгир мешавад:

<div class="parent">
	<div class="child"></div>
</div>

.parent {
	border: 1px solid red;
}

.child {
	height: 100px;
	width: 200px;
	border: 1px solid green;
	margin: 10px auto;
}

Дар хотир доред, ки ин тавр танҳо блоқи унсурҳоро, танҳо ба тариқи уфуқӣ ва танҳо агар ба онҳо паҳноӣ дархост карда шуда бошад, марказонидан мумкин аст.

Агар ба мо фосилаҳои болоӣ ва поёнии margin гуногун лозим бошад, пас метавонем ин тавр навишт:

.child {
	margin: 30px auto 10px auto;
}

Метавон бо се қимат аз нав навишт: якумӣ фосилаи болоӣ, сеюмӣ - поёниро муайян мекунад, ва дуюмӣ қимати auto-ро барои фосилаҳои ростро ва чапро муайян мекунад:

.child {
	margin: 30px auto 10px;
}

Саҳифаро ба таври намуна такрор кунед, то ки блоқҳои сабз дар маркази волидайни худ қарор гиранд: