Removing a focus color in Chrome

Question

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

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.

Answer 1

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