redconservatory
redconservatory

Reputation: 21934

Removing a focus color in Chrome

I have a colour that appears on my input and textarea fields when they are focused:

enter image description here

This seems to happen in Chrome, but not Firefox.

I have tried to change the color with a bit of jQuery:

if ($('body').is('#contact')) {
        $('input').focus(function() {
            $(this).css('border', '2px solid #ce1443');
            console.log('focus');
        });

         $('textarea').focus(function() {
            $('textarea').css('border', '2px solid #ce1443');
        });
    }

However, this appears to only make the current border bigger...but it does nothing to get rid of the blue colour.

Upvotes: 5

Views: 3738

Answers (3)

Steve
Steve

Reputation: 8640

It's something you can fix through CSS:

input:focus {
  outline: 0 none;
}

Upvotes: 2

pimvdb
pimvdb

Reputation: 154968

Use the outline: none CSS property: http://jsfiddle.net/ZnefN/.

Upvotes: 7

SpYk3HH
SpYk3HH

Reputation: 22580

try in css:

input:focus {
    outline: none;
}

and to get all input and text areas and select boxes

input:focus, select:focus, textarea:focus {
    outline: none;
}

Also, I think this might be redundant to this question

Upvotes: 5

Related Questions