Bug in IE breaks site in Opera

If an Opera-user tries to search for flights from http://www.kayak.com/s/index.jsp she will notice that random parts of the page gets covered by white while typing departures and destinations.

This is caused by a bug in Internet Explorer.

Yes, seriously. It IS caused by a bug in IE. And a bug in Opera. Developing web sites isn't supposed to be easy, but if you read this you knew that already..

In IE, a SELECT element can never be hidden by anything. It always goes on top of DHTML overlays. Except.. one day somebody discovered that an IFRAME will go on top of a SELECT. And DHTML overlays may in IE go on top of the IFRAME! Oh joy, thought the web designer and started adding perfectly sized IFRAMEs underneath menus to cover up those unruly SELECTs.

Opera gets things the other way around: SELECTs can be underneath other elements, IFRAMEs can't. So on kayak.com the airport lists that are automagically and cleverly XMLHttpRequest-loaded from the server in the background are promptly covered up by a completely empty IFRAME.

The ugly workaround is the following bookmarklet:

javascript:var s=document.getElementById('smartboxBG');void(s.parentNode.innerHTML=s.parentNode.innerHTML.replace(/iframe/ig, 'div'));

Incidentally, using that bookmarklet in IE will show you the problem the IFRAMEs were introduced to fix..


2 thoughts on “Bug in IE breaks site in Opera

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s