Я создаю сетку, используя строки и столбцы Bootstrap внутри навигационной таблетки. Пока у меня текст отображается правильно, но по какой-то причине я не могу установить текст в первой навигационной таблетке черным цветом.
Я пытался переместить класс для черного текста в разные элементы div/его собственный элемент div, но безрезультатно. Несмотря на это, первая навигационная таблетка всегда отображается серым текстом. Я также сделал класс черного текста важным свойством, но это ничего не меняет.
мой код:
.active {
color: #bdc3c7;
}
.black-text {
color: #000000 !important;
}
<div class="row">
<div class="col-md-12 w-100">
<ul class="nav nav-pills nav-justified mb-3" id="pills-tab" role="tablist">
<br>
<li class="nav-item">
<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">Mentors</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Members</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
<div class="row">
<div class="col-md-6">
<p><strong>Sean</strong> is sean</p>
</div>
<div class="col-md-6">
<p><strong>Bean</strong> is bean</p>
</div>
</div>
<div class="row">
<div class="col-md-6">
<p><strong>Sean Bean</strong> is sean bean</p>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">
<div class="row black-text">
<div class="col-md-6">
<p><strong>Sean</strong> is sean</p>
</div>
<div class="col-md-6">
<p><strong>Bean</strong> is bean</p>
</div>
</div>
<div class="row black-text">
<div class="col-md-6">
<p><strong>Sean Bean</strong> is sean bean</p>
</div>
<div class="col-md-6">
<p><strong>Bean Sean</strong> is bean sean</p>
</div>
</div>
</div>
</div>
</div>
</div>
Я ожидал, что все навигационные таблетки будут отображать черный текст, но только второй.