Justering av flex-elementer i forelderen med marginer

Verdien space-around i egenskapen justify-content setter margen fra kanten av forelderen til det første og siste flex-elementet.

Ved første øyekast kan det se ut som om avstanden mellom elementene og mellom ytterelementene og forelderen vil være like, men det er ikke tilfelle - avstanden mellom elementene vil være 2 ganger større enn mellom forelderen og ytterelementet.

La oss se på et eksempel:

css.parent {
  display: flex;
  justify-content: space-around;
}

Resultatet av koden:

Задание 1

Gjenskiv siden etter dette mønsteret: