Removing the unwanted border around a button after it has been clicked?

Untitled

In the above image, I have a button which normally displayed no border, however after it has been clicked, this border comes up around it.

Is there a simple way to remove this?

Thanks

Hello @jaredmonkman :grinning:

Can you please post your code so I can see what you are working with?

Sure, below is the html/BS and CSS.

HTML:

<button type="button" id="viewMyWork" class="btn btn-outline-info btn-lg">View My Work<br><iclass="fas fa-chevron-circle-down"></i></button>

CSS:

#viewMyWork {

    margin-top: 100px;

    color: white;

    font-family: 'Lato', sans-serif;

    border: none;

    

}

#viewMyWork:hover {

    color: white;

    background-color: transparent;    

}

Thanks

button {
  outline: none;
}

Hi, I tried this but the border/outline still persists and nothing changes. Just to be clear, this only appears after the button has been clicked.

See below for the button before I click it, then after it is clicked.

Just to clarify, the button on the right is before, then the button on the left is after I click it.

Thanks

2 Capture

Alright, try

button,
button:active,
button:focus {
  outline: none;
}

Hopefully this will work