JSFiddle - React, Tailwind, and code Playground

HTML

<ul data-title='Карьера' class='list'>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
    <li>Пункт</li>
</ul>

CSS

.list {
    border: 1px solid red;
    display: inline-block;
    padding: 1em 1em 1em 4em;
    position: relative;
}

.list:before {
    content: attr(data-title);
    position: absolute;
    left: 0;
    transform: rotate(-90deg) translateY(-50%);
    white-space: nowrap;
    top: 50%;
    color: red;
    
}