Как убрать отступы в хлебных крошках?

Question

[Анатолий Димов]

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

Повторил css в codepen, однако отступы есть. Не могу понять, как они убрали отступы, в чем причина?

Comments

[Вадим]

Потому что перенос строки в коде интерпретируется как пробел. Вот и получаются отступы.
Ответ есть в вопросе.

инлайн элементами

Можно задать dsiplay: flex, например, тогда не будет отступов. Или код в одну строку написать.

[Анатолий Димов]

Вадим, понимаю, но у них совсем пробелы отсутствуют. Не важно разрыв строки или нет, а в css нет ни каких хаков или я не вижу.

[Андрей Федоров]

Вася Булка, в смысле в css нет хаков? Да, сколько угодно. Задайте блоку нулевой размер шрифта, а в ссылах восстанавливайте нормальный. Или задайте отрицательный letter-spacing, только значение нужно подобрать.

[Rsa97]

Вася Булка, В оригинале нет никаких хаков, просто все крошки записаны в одну строку без пробелов.

<div class="pager-crumbs"><span class="pager-crumbs__item"><a href="/" title="Служба внешней разведки Российской Федерации">Служба внешней разведки Российской Федерации</a></span><span class="pager-crumbs__item">История Службы</span><span class="pager-crumbs__item">События</span></div>

[Анатолий Димов]

Андрей Федоров, я знаю про отрицательные значения... ИТД...
В этом и причина моего вопроса, так как на том сайте нету подобных хаков... Или я слепой...

[Андрей Федоров]

Вася Булка, ну, вам уже ответили. Еще можно вот так сделать - https://codepen.io/aliencash/pen/qBqOvxg?editors=1100

[Анатолий Димов]

Андрей Федоров, понял, всем спасибо... Всё в строчку там написано...

Answer 1

[Георгий Еремеев]

Перенос на новую строку в коде inline элементов действует как пробел. Убери все переносы в коде и пропадут отступы.