Значок сжимается, когда текст обертывается. (Псевдо -элемент раньше) ⇐ Html

[Anonymous]

Значок сжимается, когда текст обертывается и становится меньше, чем 36px, указанный в CSS.

Использование. происходит и как это исправить?

Код: Выделить всё

.initial {
align-items: center;
display: flex;
font-size: 12px;
margin: 10px 0px 10px 0px;
}

.initial::before {
content: attr(data-initials);
align-items: center;
display: flex;
justify-content: center;
background-color: #111111;
border-radius: 100% 100% 100% 100%;
color: #ffffff;
height: 36px;
letter-spacing: 1px;
line-height: 12px;
margin-right: 10px;
text-transform: uppercase;
width: 36px;
}< /code>


This is a smaller text.




This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text. This ist a very long text.

Подробнее здесь: https://stackoverflow.com/questions/795 ... ent-before