Remove firefox glow on focused textarea

Question

Hey all,

I can't figure this one out.. I'm trying to get rid of that blue glow when textarea is highlighted in firefox.

Here's my CSS:

textarea
{
    margin:0;
    padding:0;
    width: 598px;
    height: 600px;
    resize: none;
        outline: none;
}

:focus {
      outline:0;
      outline:none;
}

It removes it in safari, but I'm have no luck with firefox.

Thanks! Matt

Answer 1

You cannot remove the glow in Firefox I think.. Only way to do that would be by adding a custom border to your element, like border: 1px black;, that would make the input box have no glow at all.

Only popular browsers which allows the outline tag are Safari and Chrome (not sure about linux browsers).

Answer 2

I'm fairly sure that's a Mac OS X theme-specific behaviour.

Answer 3

You can remove it with -moz-appearance:none;, though that may affect the whole appearance more than you're wanting.

Answer 4

how about

*:focus {outline:0px none transparent;}

Answer 5

The better way to fix this, in my opinion, is define a custom border and :focus behavior.

textarea { margin:0; padding:0; width: 598px; height: 600px; resize: none; outline: none; border: none; }

textarea:focus { outline: none; border: none; }

Answer 6

Just add or define a border... for instance, if a border is defined and I've added outline: none; to my CSS, this does the trick.