Help with customizing Bootstrap 3 buttons and hover/active states etc


In my quote machine project I’m trying to customize the two buttons on the page that I’ve given the typical class of btn-primary. In my searching I found this bit of CSS that gets rid of most of the issues:

.btn-primary:active,, {


However, it still changes color when i click then resets to normal and I’m trying to make the buttons look the same across all these pseudo-classes. If someone could diagnose the problem and maybe give me some more info on these pseudo-classes I would be very grateful. :


This will make your button stay the same color:

.btn-primary:hover {
  background-color : #077185;
  color : #ffffff;
  border-color : #077185;
  outline: none;


Thanks for that, much appreciated. Do you know where I might be able to learn about how to do this correctly? I wasn’t able to dig up much.


This was a brute force approach for me. I looked up the .btn and .btn-primary classes in the main bootstrap.css file and looked at the pseudoselectors they use.


Man I didn’t stand a chance there! Thanks for going to the effort of doing that, it would have bugged me bigtime.