<div class="statusList scroll">
    <ul class="text-uppercase list-unstyled" role="navigation "aria-label='Állapotjelző''>
        <li><a title="alapadatok" href="#">állapot</a></li>
        <li class="divider"><i class="fas fa-caret-right" aria-hidden="true"></i></li>
        <li><a title="alapadatok" href="#">állapot</a></li>
        <li class="divider"><i class="fas fa-caret-right" aria-hidden="true"></i></li>
        <li><a title="aktuális állapot" aria-label="aktuális állapot" href="#" class="active">aktuális állapot</a></li>
        <li class="divider"><i class="fas fa-caret-right" aria-hidden="true"></i></li>
        <li>állapot</li>
        <li class="divider"><i class="fas fa-caret-right" aria-hidden="true"></i></li>
        <li>állapot</li>
        <li class="divider"><i class="fas fa-caret-right" aria-hidden="true"></i></li>
        <li>állapot</li>
        <li class="divider"><i class="fas fa-caret-right" aria-hidden="true"></i></li>
        <li>állapot</li>
    </ul>
</div>

.statusList {
	width: 100%;
	text-align: left;
}
.statusList ul li {
	display: inline-block;
	margin-left: 10px;
	font-size: 0.8rem;
}
.statusList ul li.active a {
	color: #004b88;
}
.statusList a.active {
	text-decoration: none;
	border-bottom: 1px solid #004b88;
	outline: none;
}