Can anyone help me with styling Bootstrap buttons and removing the blue frame around them after they're clicked? Here's what I've tried:
https://i.stack.imgur.com/jUD7J.png
I've looked at various solutions online suggesting to use "outline:none", but it doesn't seem to work for me. My CSS code:
.btn {
color: white;
border-radius: 0px;
background-color:rgba(124, 122, 119, 0.405);
border-color: rgba(255, 165, 0, 0.405);
margin: 15px;
max-width: 30%;
max-height: 30%;
outline: 0;
}
.btn:hover{
border-color: white;
background-color: rgba(190, 123, 34, 0.514);
outline: 0;
}
.btn:focus{
border-color: white;
background-color: rgba(255, 166, 0, 0.418);
outline: none;
border: 0;
}
.btn:active {
border: 0;
outline: 0;
}
I've tried using different variations of the outline property without success. Any insights would be appreciated. Here's the HTML code for the button if it helps:
<button type="button" class="btn btn-primary" (click)="decrementStep()">Back</button>
I'm also struggling to change the button's background color when it's clicked. Is there a way to do this in Angular using Bootstrap? Any help or guidance is greatly appreciated, as I am new to frontend development. Thank you!