- CSS -
- July 6th, 2008,
- 86 Responses
Removing Safari’s native input highlight
- 6 July
There are times when every web designer has to do the most shameful thing like faking an input filed in order to create a global order between browsers or, in some cases, simply making our dear friend IE happy.
Unfortunately it’s not IE which is causing oddities this time – in particular it is Safari itself. Basically what happens is that Apple with all it’s glory and details for a proper user experience is adding a special form of highlighting for every active/focused form widget – many came across and some are upset about the fact that it’s making impossible to create complete custom styles for the highlighted elements:
But in reality there is a way of re-styling these fields. The custom highlight can be achieved by using the outline property.
So, doing a simple outline: none will result in the blue glow being removed altogether:
Of course this solution is against all usability guidelines since we’ve just deleted the only thing indication of field being focused. Still, it’s never lupus…
More f-ups:
