Zarovnanie inline-blokových prvkov na pravý okraj v CSS

Zarovnajme prvok na pravý okraj:

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

.parent {
	text-align: right;
	padding: 10px 0;
	border: 1px solid red;
}
.child {
	display: inline-block;
	padding: 10px 20px;
	border: 1px solid green;
}

Daný div vnútri nejakého rodiča:

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

.parent {
	padding: 10px 0;
	border: 1px solid red;
}
.child {
	padding: 10px;
	border: 1px solid green;
}

Premeňte div-potomok na inline-blokový prvok, potom ho zarovnajte na pravý okraj rodiča.

Upravte predchádzajúcu úlohu tak, aby sa div neprisúval tesne k pravému okraju. Preto rodičovskému prvku pridajte pravý padding.

Upravte predchádzajúcu úlohu tak, aby sa div neprisúval tesne k pravému okraju. Preto prvku-potomkovi nastavte pravý margin.

Daný odkaz vnútri nejakého rodiča:

<div class="parent">
	<a href="" class="child">text</a>
</div>

.parent {
	padding: 10px 0;
	border: 1px solid red;
}
.child {
	width: 100px;
	padding: 10px;
	border: 1px solid green;
}

Premeňte odkaz na inline-blokový prvok, potom ho zarovnajte na pravý okraj rodiča.

Upravte predchádzajúcu úlohu tak, aby bol text vnútri odkazu zarovnaný na stred tohto odkazu.