Alineación de elementos en línea-bloque a la derecha en CSS

Alineemos el elemento a la derecha:

html<div class="parent">
  <span class="child">texto</span>
</div>
css.parent {
  text-align: right;
  padding: 10px 0;
  border: 1px solid red;
}
.child {
  display: inline-block;
  padding: 10px 20px;
  border: 1px solid green;
}

Результат:

Задание 1

Se da un div dentro de algún elemento padre:

html<div class="parent">
  <div class="child">texto</div>
</div>
css.parent {
  padding: 10px 0;
  border: 1px solid red;
}
.child {
  padding: 10px;
  border: 1px solid green;
}

Convierta el div hijo en un elemento en línea-bloque, luego alinéelo a la derecha del padre.

Задание 2

Modifique la tarea anterior para que el div no quede pegado firmemente al borde derecho. Para ello, agregue un padding derecho al elemento padre.

Задание 3

Modifique la tarea anterior para que el div no quede pegado firmemente al borde derecho. Para ello, establezca un margin derecho al elemento hijo.

Задание 4

Se da un enlace dentro de algún elemento padre:

html<div class="parent">
  <a href="" class="child">texto</a>
</div>
css.parent {
  padding: 10px 0;
  border: 1px solid red;
}
.child {
  width: 100px;
  padding: 10px;
  border: 1px solid green;
}

Convierta el enlace en un elemento en línea-bloque, luego alinéelo a la derecha del padre.

Задание 5

Modifique la tarea anterior para que el texto dentro del enlace esté centrado dentro de este enlace.