How can i remove the border that apears when i select my button?

Question

i can add a border to my button also i can disable the border so i dont have one, but how can i remove the border that apears when i click on my button?

and no it doesnt work with

button:hover {
border:none
}

please help because this ruins my design :(

https://code.sololearn.com/WF3Q16a04ESU/?ref=app

Answer 1

That outline is somewhat annoying for a good-looking website. This is one simple way to remove the button border with respect to your code :

button {
outline: none;
}

Answer 2

http://outlinenone.com/

Personally i remove the outline through the ":focus" selector, but for better learning you should know that remove it damages the accessibility for those who have visual problems.

Answer 3

Julien, i just gave you an article to deepen your knowledge, solution to your question is provided by Dayve. ;)

Answer 4

Thank you guys it helped me :D
normally I mark the best answer but here are two of them so i dont to be fair