Изменить цвет активной ссылки на отдельный элемент меню

Question

Я создал кнопку в меню своего веб-сайта и хочу назначить ей собственный индивидуальный цвет активной ссылки, как мне поступить?В идеальном мире кнопка будет розовой (# ed6d8d), а активный цвет текста будет белым.В настоящее время цвет активного элемента меню по умолчанию синий (# 00bcd1), поэтому он будет ужасно конфликтовать с розовым - любой совет будет высоко ценится!

Я использовал следующий код CSS для создания кнопки:

 #in-crisis li a:hover {opacity: 1!important;
    color: #ffffff;}

.in-crisis a {
    border: 2px solid #dbf7ff!important;
    padding: 12px!important;
    margin: 10px 12px 12px 12px;
    border-radius: 12px;
    text-align: center;
    background-color: #dbf7ff;

}

.in-crisis a:hover {
    background-color: #fff;
    color: #00bcd1!important;
    border: 2px solid #00bcd1 !important;
}

.et_header_style_left #et-top-navigation {
    padding-top: 16px!important;
}

.et_header_style_left .et-fixed-header #et-top-navigation {
    padding-top: 6px!important;
}

#main-header.et-fixed-header .in-crisis a {
color: #00bcd1 !important;
}

@media only screen and (max-width: 980px) {
.in-crisis a {
    background-color: #dbf7ff;
    }
}

@media only screen and (min-width: 980px) {
#et_top_search { 
    margin-top: 25px !important; }
}

Большое спасибо заранее.

Answer 1

Я не знаю, говорите ли вы о hover или active, но для активного css вы должны использовать

.in-crisis a:active {
  color: white;
  //or anything else here
}