Цвет начальной загрузки на текстово-белом классе игнорируется

Question

У меня нет кода для показа, но мне было интересно, сталкивался ли кто-нибудь с этой проблемой.

У меня есть ссылка:

<a href="..." class="btn btn-primary text-white">...</a>

Текст отображается белым цветом, однако, когда ссылка активна / зависла / посещена, по умолчанию используется фиолетовый цвет.

В качестве теста я попытался добавить это прямо над ссылкой, но это не работает:

<style>
  .text-white a:hover,
  .text-white a:active,
  .text-white a:visited
  {
    color: white;
  }
</style>

Рабочий пример:

.text-white a:hover,
.text-white a:active,
.text-white a:visited
{
    color: white;
}

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>

<a href="#" class="btn btn-primary text-white">A Link</a>

Answer 1

Вы назвали свой класс .text-white и в css вы написали: .text-color. Имена классов должны быть равны.