Weird problem with Control.Tabs and IE6/7 – solved!
Nov 18th, 2007 by anthony - Tags: Contro.Tabs, CSS, IE6, IE7, problem, Prototype, solution
Control.Tabs is a simply wonderful JavaScript extension for the Prototype library. In one project I’m using in multiple places and it fits the requirements perfectly. There is, however, a weird problem with one page with IE where instead of displaying the form like this:
it looks like this:
As you can see the headings and the “Add another photo” links disappeared. Obviously, it shouldn’t do that. Oddly enough, if I move the pointer over one of the links higher up on the tabs the missing elements appear.Once I work out the solution I’ll post it.
The Solution
The solution has presented itself. I’m not 100% sure what the exact cause is, but it was fixed by simply giving the disappearing items an absolute height in the CSS, e.g. “height:35px” for the missing link, and it all worked again in both IE 6 and 7. Go figure.
You can skip to the end and leave a response. Pinging is currently not allowed.
Seems you got hit by the “Peek-a-boo” Bug. I thought it was gone in IE7.
Chris: the bug was identical in IE 6 and 7, so either I had an obscure bug in my HTML/CSS or this bug hasn’t been fixed in IE yet.