Welcome to WebmasterWorld Guest from 54.159.165.175

Forum Moderators: not2easy

IE declaration/fix

despite zoom: 1 page not displaying

   
12:22 am on Feb 16, 2009 (gmt 0)

5+ Year Member



I am using this in my header:
<!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixLtHdr #sidebar1 { padding-top: 0px; }
.twoColFixLtHdr #mainContent { padding-top: 0px; }

.twoColFixLtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
************

Doc declaration: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
***********
It solves the problem for IE7, but not IE6. IE 6 displays my left column (sidebar)with it's full length - the right column begins where the left(sidebar) ends and then fully displays it.

I tried {height: 1%;} fix, but that displayed everything at 1% height on IE6...

I am now moving on to trying this:
<!--[if IE 6]>

<style type="text/css" src="ie.css" mce_src="ie.css" />

<![endif]-->

Is this a more stable approach? I appreciate ANY help - you all know the frustration.
Thanks.

12:50 am on Feb 16, 2009 (gmt 0)

WebmasterWorld Senior Member swa66 is a WebmasterWorld Top Contributor of All Time 10+ Year Member



You can use links to a stylesheet for IE7 and IE6 separately (giving them each a file only they will add to all you pages) by adding something like this:

<link rel="stylesheet" type="text/css" href="/style.css" />
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="/ie6.css" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="/ie7.css" />
<![endif]-->

Advantages:
- doesn't target IE8 (odds are it won't need much at all), and you can apply different fixes for IE6 and IE7.
- only loads once for all of your site instead of transferring of the fixes (which I've gotten sometimes to be longer than the original) with each page itself.

I've seen haslayout expand floated blocks to the width of their parent if they have no width specified themselves. Try adding a width to the floated element. (Yeah, I understand, but if you just do it for IE6, it'll probably degrade somewhat ok in that browser, and work as intended in the others)

5:45 am on Feb 18, 2009 (gmt 0)

5+ Year Member



Thank you - again!

I did not realize it mattered where the
<link rel="stylesheet" type="text/css" href="/style.css" />
was located (as in: above the <!--[if IE 6]> comment). Makes sense, but am new to CSS styling.

The site now displays properly in IE6. Can't thank you enough!

 

Featured Threads

My Threads

Hot Threads This Week

Hot Threads This Month