I’ve been wrestling with CSS bugs over the past three days while trying to hone a design, but the strangest one was finding out that two popular image replacement techniques (1, 2) don’t work in mac IE 5 if you use anything besides a heading element to hide your text.
<h1 id=”logo”>logo text</h1>
will hide the “logo text” and replace with an image, but:
<div id=”logo”>logo text</div>
will not. Makes no sense and prevents me from using it on a public site, since I no longer want to use headers to describe logos.
Try this test page in Mac IE 5 to see the bug.
update: yeah! a fix!