How to remove button border when press

Question

Hi I am having problem of removing button's border when clicking I use border:none but doesn't work I put border-radius to my button , but when I click there is a border that appears in square how to remove this?

here is my image Thanks in advance..

here is my css

.putadditionalitem{
    width:49%;
    height:100%;
    border-radius:50px;
    font-size:25px;
    font-weight:bold;
    font-family:Poplar Std;
    color:#fff;
    background: #05f11b;
    background-image: -webkit-linear-gradient(top, #05f11b, #0bbb1c);
    background-image: -moz-linear-gradient(top, #05f11b, #0bbb1c);
    background-image: -ms-linear-gradient(top, #05f11b, #0bbb1c);
    background-image: -o-linear-gradient(top, #05f11b, #0bbb1c);
    background-image: linear-gradient(to bottom, #05f11b, #0bbb1c); 
    margin-bottom:5px;
}

[Possible duplicate](http://stackoverflow.com/questions/20340138/remove-blue-border-from-css-custom-styled-button-in-chrome) — Timo, Jul 31 '15 at 08:39
You need to have a look @ CSS outline (https://developer.mozilla.org/en-US/docs/Web/CSS/outline) but you also need to keep in mind this is used for accesibility also. — timothyclifford, Jul 31 '15 at 08:42

score 6 · Answer 1 · answered Jul 31 '15 at 08:38

6

It's not the border that does that, it's the outline.

Use

outline:none;

and that will fix it.

Here's an example:

.no-outline {
    outline:none;
}

<input type='text'>
<br><br>
<input type='text' class='no-outline'>

The first input has a blue outline around it on :focus, the second one doesn't.

answered Jul 31 '15 at 08:38

Albzi

15,431
6
46
63

YES! that is what I am looking for by the way is my question so easy? – Brandon Jake Sullano Jul 31 '15 at 08:42
It's a simple question, but it's a valid one :) @BrandonJakeSullano – Albzi Jul 31 '15 at 08:42
I will accept your answer tomorrow hehe it it says you can accept answer after 7 minutes then I need to go :) THANKS! – Brandon Jake Sullano Jul 31 '15 at 08:44
OK no worries, glad I could help! @BrandonJakeSullano – Albzi Jul 31 '15 at 08:47

How to remove button border when press

1 Answers1