Односторонние отступы как средство от головной боли

Прекрасная статья от Harry Roberts csswizardry.com/2012/06/single-direction-margin-declarations/.

Суть идеи состоит в использовании односторонних вертикальных марджинов. Это создает аккуратный вертикальный ритм и позволяет менять элементы местами не опасаясь, что вертикальные отступы разной величины где-то схлопнутся непредсказуемым образом.

В качестве подопытного кролика возьмем такой макет:

Всем элементам шапки задан одинаковый отступ в одном направлении. В данном случае, вниз.

Вот код, управляющий отступами:

.header-item {
  margin-bottom: 1.2em;
}

.header-item:last-child {
  margin-bottom: 0;
}

Первый блок задает одинаковый отступ вниз для всех блоков в шапке, второй убирает его у последнего элемента.

Теперь можно сколько угодно менять местами элементы шапки, и всё равно все варианты будут аккуратно смотреться:

По-моему, идея гениальна в своей простоте.