Почему бы не использовать css grids?

position: relative резервирует место в потоке

Обычно для родительского блока используют position: relative, а для внутреннего блока position: absolute.

В данном случае, мне кажется лучше отказаться от абсолютного или относительного позиционирования текста и сверстать например так.

Еще вариант

Вариант с использованием box-shadow:

box-shadow: 10px -10px 0px 0 white,
    10px -10px 0px 1px teal;

При такой реализации можно обойтись без лишних оберток и использования псевдоэлементов
Пример на codepen

Все что со звездочкой это хаки для ИЕ6, их уже можно сносить. А это похоже просто на ошибку:

position: relative;;
margin: 0 10px 0 0;;

Сайт с каталогом хаков для всех браузеров)
browserhacks.com