2

I built a little Chrome extension that has two buttons that change the content of the webpage depending on the button you click. However, Chrome is automatically focusing on the top button, and putting its blue highlighter around it. See the screenshot:

enter image description here

I assume that Chrome has some sort of default that automatically styles it, and it must focus on the top button. Is there anyway to have Chrome avoid highlighting buttons?

There's nothing to my HTML:

<div id="conservative">
    <button id="conservatize">Conserve it!</button>
    </div>
    <div id="liberal">
        <button id="liberalize">Liberate it!</button>
    </div>
</body>
EmptyArsenal
  • 7,314
  • 4
  • 33
  • 56

1 Answers1

4

Try adding the following to your CSS:

*:focus {
    outline:none;
}

I found the code in following thread: Chrome default focus outline.

Community
  • 1
  • 1
srikarg
  • 331
  • 1
  • 5
  • 14