Docs

[BUK95]

When I click a link or a button the text appears suddenly in a box (4 colored lines). The colors of the lines is in case of my navigation menu “blue”, in case of buttons they are red.

I have no idea where this suddenly comes from.

Thanks for your help

[Christopher]

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[BUK95]

After some testing I noticed that the problem only occurs when I use Firefox on my main PC. It does not appear when I use other browsers or use my laptop.

I assume it has something to do with my Firefox settings. These create colored outlines (blue or red) whenever I click a link or a button.

The URL is http://facing-it-together.com/ but I assume you will not notice any problem.

Do you have an idea by any chance what should be changed?

[Paul R]

Hi,

You can try adding this under Custom > CSS in the Customizer.

body a {
   outline:none;
}

Hope that helps.

[BUK95]

Unfortunately it did not solve the problem. I have made a screenshot that shows what happened when I click on a link.

[Darshana]

Hi there,

You have the following custom CSS rule which makes that effect.

a:focus, select:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="submit"]:focus, input[type="checkbox"]:focus {
    outline: 5px auto #0066bf;
    outline-offset: -1px;
}

You can change it as follows.

/*remove border around links and buttons in Firefox*/
a:focus, a.x-btn:focus, select:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="submit"]:focus, input[type="checkbox"]:focus, 
input[type="button"]:focus {
outline: none;
}

Hope that helps.

[BUK95]

Thanks very much. Problem solved. You have been a great help as always.

[Zeshan]

You’re most welcome! 🙂

[Author]

Posts