Friday, July 29, 2011

Just how stupid are IE users?

While I was very frustrated in fixing all the IE6 bugs for our website, this article came to me and bright up my day "Just how stupid are IE users"..http://news.cnet.com/8301-17852_3-20085679-71/just-how-stupid-are-ie-users/?fb_ref=fblike&fb_source=home_multiline.. very funny! I personally have no problems with IE or IE users and I don't think there's any correlation between a user's IQ and his/her browser. But IE 6 does give me a lot of headaches in application development and it's a pain in the butt to fix all its errors and bugs. So if you are still using IE6, please please upgrade it to IE 7 or higher. Or just use firefox or chrome or safari..

However, as an application developer, sometimes it's not my choice to make our website IE6 compatible. In this blog I will put down some of the IE 6 bugs that I encountered in my developer life. Hopefully you will find it useful and save you some efforts and time while you scratching your head for a IE6 bug.

1. When placing an absolute div within a relative positioned div, in IE6 and IE7 that div disappeared. The content within the div and the div just would not show. The fix is to wrap the absolute div with another empty <div> </div>.

2. Place an absolute div over a select tag in IE6. This happens a lot to pop up menu.. drop down menu.. popup tooltips. etc.. the fix is to add an empty iframe on top of the select tag and then put your popup div on top of the iframe. Here is some good articles:
http://esdi.excelsystems.com/wsexmp/divdrp.pgm?wsnum=00110
http://www.sitepoint.com/forums/css-53/div-menu-showing-under-select-element-ie6-iframe-solution-570683.html
http://weblogs.asp.net/bleroy/archive/2005/08/09/how-to-put-a-div-over-a-select-in-ie.aspx
someone even created a Jquery plugin for this fix.. Bravo to that.. here is the link to the plugin:
http://plugins.jquery.com/project/bgiframe

3. z-index fix.. I have  a list tag <ul><li>kk</li> </ul> and no matter how high the z-index is in the <li> tag, the content will not show as you expected on top of all other contents. This only happened to IE6/7.. the fix is to raise the z-index of the <ul> instead of <li>.. this way it will layer the content correctly.

4. zoom: 1 fix a lot of display errors in IE6/7. When I have some CSS that just won't work in IE, I see if adding a ZOOM property of 1 (one) will help. More about this issue:
http://www.positioniseverything.net/articles/haslayout.html
http://www.bennadel.com/blog/1354-The-Power-Of-ZOOM-Fixing-CSS-Issues-In-Internet-Explorer.htm

Will update this blog if I find and fix more bugs in the future~

No comments:

Post a Comment