Bootstrap 5: When i clicked my button, the color changed

October 27, 2023

Im using bootstrap button, then i changed the color of the button. but when i clicked the button it change to blue, even though i write .btn-primary:active

HTML:

<button type="button" class="btn btn-primary">My Button</button>

CSS:

.btn-primary {
  background-color: #ffa500;
  border: 1px solid #e39400;
}

.btn-primary:hover {
  background-color: #e39400;
  border: 1px solid #e39400;
}

.btn-primary:active {
  background-color: #e39400;
  border: 1px solid #e39400;
}

>Solution :

use !imporant and it should work

.btn-primary {
  background-color: #ffa500;
  border: 1px solid #e39400;
}

.btn-primary:hover {
  background-color: #e39400;
  border: 1px solid #e39400;
}

.btn-primary:active {
  background-color: #e39400 !important;
  border: 1px solid #e39400 !important;
}