As a developer sometimes some of the browser styling and OS styling can be extremely annoying. One of them is the blue border that the mac OS puts around their input and text area boxes. A lot of people are stating that you cannot get rid of it, but that’s not true. It’s very simple actually. All you have to do is add outline:none to your input class and your golden! Extremely easy and a nice little tip for you developers and designers. Have fun!

I worked on this issue for a good two hours. I know it sounds silly, but for some reason IE 7 wouldn’t get rid of the border around the text box. Well I researched the issue and everyone kept giving crazy solutions like putting a span around it and put the border there, put border-color:transparent, and a few other ridiculous ideas.

The simple solution was to just hard code the styling in the input or textarea. Like:

<textarea style=”border:none;”></textarea>

And that’s it!!!! Fixes the issue!