Allineamento degli elementi inline-block a destra in CSS

Allineiamo l'elemento a destra:

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

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

Dato un div all'interno di un genitore:

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

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

Trasforma il div figlio in un elemento inline-block, poi allinealo a destra del genitore.

Modifica il compito precedente in modo che il div non sia strettamente aderente al bordo destro. Per fare ciò, aggiungi una padding destra all'elemento genitore.

Modifica il compito precedente in modo che il div non sia strettamente aderente al bordo destro. Per fare ciò, imposta un margin destro all'elemento figlio.

Data un link all'interno di un genitore:

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

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

Trasforma il link in un elemento inline-block, poi allinealo a destra del genitore.

Modifica il compito precedente in modo che il testo all'interno del link sia allineato al centro del link stesso.