Pracuję na stronie internetowej i chcę mieć niestandardowy styl<button> tagi. Więc z CSS powiedziałem:border: none. Teraz działa doskonale w safari, ale w chrome, gdy klikam jeden z przycisków, umieszcza wokół niego irytującą niebieską ramkę. myślałembutton:active { outline: none } lubbutton:focus { outline:none } zadziała, ale nie. Jakieś pomysły?

Tak wygląda przed kliknięciem (i jak chcę, aby nadal wyglądało po kliknięciu):

I to jest granica, o której mówię:

Oto mój CSS:

button.launch {
    background-color: #F9A300;
    border: none;
    height: 40px;
    padding: 5px 15px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 300;
    margin-top: 10px;
    margin-right: 10px;
}

button.launch:hover {
    cursor: pointer;
    background-color: #FABD44;
}

button.change {
    background-color: #F88F00;
    border: none;
    height: 40px;
    padding: 5px 15px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 300;
    margin-top: 10px;
    margin-right: 10px;
}

button.change:hover {
    cursor: pointer;
    background-color: #F89900;
}

button:active {
    outline: none;
    border: none;
}