Как обойти проблему с пробелом в span элементе?

Question

[Ришат Султанов]

Всем привет. Есть блок который имеет значение под бегунком реализованные они в span.
Но когда в значение появляется пробел. То текст превращается в парочку (лезет друг на друга).
Нормальное состояние:

Проблемное состояние:

<div class="progresstreking">
                        <div class="circle done">
                            <span class="label" style="visibility: hidden">1</span>
                            <span class="title" style="font-weight: bold; opacity: 0.6;">Процесс Привлечения</span>
                        </div>
                        <span class="bar done"></span>
                        <div class="circle done">
                            <span class="label" style="visibility: hidden">2</span>
                            <span class="title" style="font-weight: bold; opacity: 0.6;">Выпуск</span>
                        </div>
                        <span class="bar half"></span>
                        <div class="circle active">
                            <span class="label" style="visibility: hidden">3</span>
                            <span class="title" style="font-weight: bold; opacity: 0.6;">Доставка</span>
                        </div>
                    </div>
                </div>

Как решить проблему?(

Answer 1

[Владислав Лысков]

white-space:nowrap

Comments

[Ришат Султанов]

Спасибо Вам большое за оперативность :)

Answer 2

[Илья Герасимов]

Долго думал причем тут пробел)) Дело не в пробеле а в том, что текст не влезает в отведенное ему место, потому и вылезает, варианты: уменьшить line-height чтобы отступ был поменьше, запретить переносы и добавить overflow:hidden, изменить размеры