Когда я нажимаю на кнопку «HTML», отображается синяя рамка «Выбор»

Question

Я создал эту кнопку HTML, и после ее стилизации с помощью CSS каждый раз при нажатии на нее вокруг нее появляется синяя рамка выделения. Есть ли способ исправить это? Я знаю, что элемент неизмененного по умолчанию не делает этого, когда я его создаю, поэтому я думаю, что он должен иметь какое-то отношение к CSS, который я добавил.

HTML:

<button type="button" class="drop-button" >-</button> 

CSS:

.drop-button { 
    background-color: #343436; 
    color: #FFFFFF; 
    border: none; 
    border-radius: 5px; 
    margin-right: 8px; 
    margin-left: 4px; 
    height: 20px; 
    width: 25px; 
    font-size: 20px; 
    vertical-align: middle; 
    line-height: 0px; 
} 

Here is a link to it.http://jsfiddle.net/xytxnpyt/

Answer 1

Это поведение по умолчанию Chrome. Вы можете отключить его с этим ...

button:focus{ 
outline: none; 
} 

Answer 2

Здесь вы идете:

.drop-button:focus { 
    outline: 0; 
} 

Fiddle

Answer 3

Хотя я не мог воспроизвести синюю рамку выбора вы говорите в JSFiddle, попробуйте добавление «outline-width: 0px;» на CSS кнопки и посмотреть, что это делает что-то