Here’s how you can remove the Bootstrap button focus border using just one line of CSS.
Final Output:
1. Add your Bootstrap button.
<button type="button" class="btn btn-lg btn-primary">Primary</button>
Output:
2. To remove the blue border or the outline that stays on click, set the box-shadow to none on focus.
.btn:focus{
box-shadow: none;
}
Output:
Final Output Code for Bootstrap Button Remove Border:
HTML:
<button type="button" class="btn btn-lg btn-primary">Primary</button>
CSS:
.btn:focus{
box-shadow: none;
}
Video explanation for Bootstrap Button Remove Border:
If you have any doubts or stuck somewhere, you can reach out through Coding Yaar's Discord server.