how to disable the button clicked style css

Question

how can i disable the clicked button style { the black border}

.cols-1 button {
    position: absolute;
    bottom: 50%;
    right: 50%;
    margin: 0px -160px -40px 0px;
    background-color: #aec7ca;
    color: #ebebeb;
    border: none;
    border-radius: 0.3rem;
    padding: 25px 85px;
    transition: all 0.3s ease 0s;
}

As tkahn mentioned below, this is an important browser feature and you shouldn't disable it. For users like me who have trouble using a mouse, we rely on that black outline to let us know which element is actively focused (by pressing "tab" and moving between buttons/links on the page) — Joshua Comeau, Dec 15 '20 at 13:44

score 1 · Accepted Answer · answered Dec 15 '20 at 13:34

If you are referring to the style that the button gets when it's in focus (using tabs or by clicking), it's removed using:

outline: none;

However this is considered bad for accessibility so consider keeping the outline, but giving it a more subtle styling.

.myButton:focus {
  outline: thin dotted;
  outline-color: #cccccc;
}

how to disable the button clicked style css

1 Answers1