How to fix NiftyCube IE 8 width problem

Written by Ken Kinder on October 26, 2009 — 6 Comments

At work we use this tool called NiftyCube to round corners of elements (it even works with divs that have gradients in them). The problem, however, is that on Internet Explorer 8, 100% width divs are shrunk to the contents of the div.

That happens because NiftyCube has code to correct rendering problems in previous version of IE. Since IE 8 renders more elements correctly, NiftyCube’s hack actually makes things worse in IE 8. To fix the problem, disable their fix for IE 8. Apply this change to niftycube.js:

Index: tuber/trunk/common/web/htdocs/assets/js/niftycube.js
===================================================================
--- a/tuber/trunk/common/web/htdocs/assets/js/niftycube.js
+++ b/tuber/trunk/common/web/htdocs/assets/js/niftycube.js
@@ -156,7 +156,22 @@
 }
 
+function getIeVersion() {
+    var rv = -1;
+    if (navigator.appName == 'Microsoft Internet Explorer') {
+        var ua = navigator.userAgent;
+        var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
+        if (re.exec(ua) != null) {
+            rv = parseFloat(RegExp.$1);
+        }
+    }
+    return rv;
+}
+
 function FixIE(el){
 if(el.currentStyle!=null && el.currentStyle.hasLayout!=null && el.currentStyle.hasLayout==false)
-    el.style.display="inline-block";
+    var ver = getIeVersion();
+    if (ver < 8) {
+        el.style.display="inline-block";
+    }
 }

6 Comments to “How to fix NiftyCube IE 8 width problem”

You can follow all the replies to this entry through the comments feed.

Eino

November 6, 2009 at 2:33 AM | Permalink

Works great! Thanks.

Alberto

November 9, 2009 at 3:09 AM | Permalink

Thanks a lot!! Works perfect

Michael 'Mongoose' Lundie

November 14, 2009 at 7:59 PM | Permalink

You are a legend! This has been causing me problems, since I use this script on our back end system. It has been driving me up the wall! Thank you, thank you, thank you!

Your new best friend,
Mongoose.

niculicchio

February 17, 2010 at 8:32 AM | Permalink

you’re a genius!!!

Daniel Wong

March 11, 2010 at 7:05 PM | Permalink

Sweet! I’m sure this would have taken me a while to track down. Thank you!

fman

June 2, 2010 at 12:46 AM | Permalink

Thanks a lot

How to fix NiftyCube IE 8 width problem

6 Comments to “How to fix NiftyCube IE 8 width problem”

Leave a Reply