How do i remove the blue outline from a radio box when focused?

html css checkbox radio
The301 picture The301 · Apr 13, 2016 · Viewed 11.8k times · Source

I would like to remove the blue outline it gives me when my radio is clicked/focused. I tried using outline: none and border: none, but nothing seems to be working. Does anyone have a solution for this?

Screenshot of what I’m talking about:

Image

Answer

Wowsk picture Wowsk · Apr 13, 2016

Remove the outline when the input element has the focus.

input:focus{
  outline:none;
}

As a side note, this is only for Google Chrome, other browsers use different techniques for showing an input element has the focus.

Related questions

How to style a checkbox using CSS

I am trying to style a checkbox using the following: But the style is not applied. The checkbox still displays its default style. How do I give it the specified style?

Read More
Radio/checkbox alignment in HTML/CSS

What is the cleanest way to align properly radio buttons / checkboxes with text? The only reliable solution which I have been using so far is table based: <table> <tr> <td><input type="radio" …

Read More
How to change the background color on a input checkbox with css?

Hello Friends all I'm trying to do is change the background color of a checkbox. I tired many things but nothing works. Can some one help? input[type="checkbox"] { background: #3d404e; border: #7f83a2 1px solid; }

Read More