Search code examples
htmlcssborderonfocus

How to get rid of a weird form border on focus

Ayo,

I have built a contact form and every time I click on a specific input field to fill it out, it imitates a weird blue border around the input field.

I think the best way to present you the problem with code is if you visit my website - I don't know which of my 1k line in css triggers that so please take a look to the very bottom of the website https://www.adamsochorec.com/about/[ ](https://www.adamsochorec.com/about/)

I've tried to remove it by setting border: to none on :focus but that did not work and the effect isn't generally visible while I inspect the page. So I was wondering if it might be some browser preset or something? It is both on Brave and Safari browsers. no outline before clicking in, enter image description here outline after clicking in enter image description here

EDIT: Outline: none worked!

Solution

  • It seems like an input, you can use:

    input:focus{
  outline: none;
}

    You can replace input with textarea or anything else in your case.