html - Removing outline on image map area

Question

Is there anyway to remove the outline when you select an area on an image map? See:

I'm using Chrome on Snow Leopard.

Answer 1

It seems like all you got to do to remove these borders lies on the img tag, by setting the hidefocus attribute and the outline css property on it like this:

HTML

<img class="map" src="..." usemap="..." hidefocus="true" />

CSS

img.map, map area{
    outline: none;
}

This should work cross-browser!

EDIT

Like Sergey K commented, if you're not looking to support IE6 you can save bytes by just using an attribute selector.

img[usemap], map area{
    outline: none;
}

Support starts with IE7.