Have you ever noticed that when using Safari Internet browser, when you click your mouse into an input field, nine times out of ten there will be this blue highlighted ring type thing appear around the edge of the input field.

This from what I can tell only applys to Safari and no other Internet browser.

This is the box when you have not clicked your mouse into it:

and this is the box when you have clicked your mouse into it:

Ok, we agree, there might be a way you can disable this in your Safari browser, but lets just suppose you want the viewer to see your website how you intend in all browsers.

The way you fix this is simple, you just need to add a tiny bit of CSS into the tag as below.

This is the tag without the modification:
<input name=”your_field_name” type=”text” id=”your_field_id” />

and this is it with the extra code:
<input name=”your_field_name” type=”text” id=”your_field_id” style=”outline:none;” />

The end result will then be like this:

As you can see its very simple, you can probably put this into a style sheet instead of inline just to make it apply to everything. So the little bit of code is the outline:none section, this basically tells it that you do not want an outline.