i'm using bootstrap for my project, and don't like the button that has a blue outline when pressed it, how to disabled the blue outline?
Asked
Active
Viewed 1,055 times
3 Answers
0
Some browsers add such a border by themselves, then it is hard to remove it. But Bootstrap also adds such a blue border to some form-input elements. There are several questions with answers on how to modify it, for example How can I change the border/outline color for input and textarea elements in Twitter Bootstrap?.
In your case, you could set border: none;
to try to remove it. But as I said, it might also be a browser feature, and not related to Bootstrap, so you just have to try it out.
0
Add into your css this code:
.form-control:focus {
border-color: #ccc;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
(Change border color if you want)

user3779272
- 1
- 1
0
For buttons, you'll need to modify the outline property on focused buttons. This will work for you
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
outline: 0;
}
Take a look at this CodePen to see it in action. Hope this helps.

Bart Jedrocha
- 11,450
- 5
- 43
- 53