CODEWITHSUNDEEP
cssinternet-explorerinternet-explorer-8outline
J O'Driscoll
J O'Driscoll

Reputation: 315

Infamous "outline: none;" issue within IE(8)

http://www.massgeneral.org/international/dev/content-wrap.aspx

I'm attempting to remove the outline boxes that are created when clicking the anchors tags (Arrows and Thumbnails) within a UI I've built. I've set the "outline: none;" to all the anchor elements tortured by this border issue. The style is being pulled into the selectors for the anchor elements within IE, however, the outlines are still being generated when a user clicks one of the elements.

http://oi50.tinypic.com/2mfxfg2.jpg

Any advice?

div#wrap a, div#wrap a:focus, div#wrap a:active,
div#wrapWrap a, div#wrapWrap a:focus, div#wrapWrap a:active {outline: none !important;}

I do apologize ahead of time as I'm aware this question has been answered on several discussions. However, after doing research, it appears I'm following the proper procedures to resolve this issue. Unfortunately, the issue is still occurring within my implementation.

Please only test this issue within IE8 or greater, Thanks ahead of time.

Upvotes: 1

Views: 1257

Answers (2)

Forty-Two
Forty-Two

Reputation: 7605

Actually that dotted outline is an accessibility feature (for those that cannot, or choose not to, use a mouse) that is built into IE. Really it probably shouldn't be removed, and, honestly, doesn't really wreck your layout or anything. But if you must remove it maybe one of these links will help you out:

Upvotes: 1

Jonah Bishop
Jonah Bishop

Reputation: 12571

The following line in your <head> element is biting you:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>

As mentioned in this answer, you need to remove that line to disable IE7 emulation mode. Note also that if you're running on IIS, the server itself can force this emulation mode (so check that also, if removing this doesn't solve the problem). Also, make sure your doctype is set appropriately.

Upvotes: 3

Related Questions