User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.7; rv:10.0) Gecko/20100101 Firefox/10.0 Build ID: 20120129021758 Steps to reproduce: Tried making <area> visible via roughly this CSS: area{display:block; visibility:visible; } area:before{content: " foo "; } Actual results: * It did not react to the CSS - did not display. * Firebug reports that the computed style is display:none Expected results: It should have worked like in Webkit, Opera and IE10: * " foo " should have been displayed as visible text * the visible text should have acted as a clickable area link * the visible area link should also have been possible to tab to

Regression windoe(m-c) Works: http://hg.mozilla.org/mozilla-central/rev/89cf6d3f66f1 Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.3a1pre) Gecko/20091231 Minefield/3.7a1pre ID:20091231121343 Fails: http://hg.mozilla.org/mozilla-central/rev/599d0aa600c9 Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.3a1pre) Gecko/20091231 Minefield/3.7a1pre ID:20091231132117 Pushlog: http://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=89cf6d3f66f1&tochange=599d0aa600c9 In local build First bad changeset ab3e23cefcce Last good changeset 89cf6d3f66f1 Triggered by:Bug 536716

Do any other UAs allow this?

(In reply to Boris Zbarsky (:bz) from comment #2) > Do any other UAs allow this? All other UAs allow this: Gecko until Firefox 3.6, Trident - at least since IE9 (imperfect in IE8) Webkit, Chromium, Presto: Yes. To verify, just try the test file attachments. You can think of this a <a> with @coords and @shape (like in HTML4), except that one must do more to make it work. However the issue is not only what should be possible to do via CSS, the issue is also related to accessibility: There seems to me to be a direct link between the lack of CSS-stylability and Firefox4+'s deteriorated keyboard access to image maps (especially when the image is lacking/not displayed) - see the bugs that this bug block. Some comments on the attachments so far: #1 The OBJECT image map demo attachment: <https://bug725921.bugzilla.mozilla.org/attachment.cgi?id=595950> The file tests what happens when the <object> has dimensions set, but the image isn't displayed: * <area> is NOT displayed by Firefox 4-12. But YES, the UAs mentioned above do display it. When displayed, <area> is also mouse click-able * <area> is NOT keyboard focusable in Firefox 4-12 and also not in IE9. But in the other mentioned browsers it is keyboard focusable, and reacts to :focus{CSS} * :focus{CSS} effect: Firefox 4 +: nothing happens Webkit/Opera/Chrome/Firefox 3.6: light up <area> IE9: It lights up the image, as long as it has dimensions set. <area> not highlighted. NOTE: If dimensions are not set, then, in IE, tabbing jumps over the <area> elements. #2 An IMG image map demo is attached with this posting. It tests what happens when the image *does* display: * <area> is not displayed by Firefox 4 to 12. But YES, the UAs mentioned above do display it. When displayed, <area> is also mouse click-able. * <area> is NOT keyboard focusable in Firefox 4-12 But in the other mentioned browsers it is keyboard focusable, and reacts to :focus{CSS}. * :focus{CSS} effect: Firefox 4 +: non-CSS light up of image area. Firefox 3.6: non-CSS light up of image area but no light up of <area> Webkit:<area>+img area simultaneously light up Opera: like Webkit. Chrome: only image area lights up. IE9: neither <area> or img area lights up - instead entire image lights up.

OK. Leaving open for now, then; whenever someone rewrites imagemaps to work sanely (bug 135040) we can fix this.