Jul

17

The Multiple IE installer found at TredoSoft is a great piece of software.  It allows you to see how your web page will look in the different version of IE browsers.  This is very helpful for those who are concerned with the look and feel of their website in the different versions of internet explorer.

The one drawback that I came across is when I was targeting my CSS for particular implementations of IE.  To get my web pages to look consistent across different versions of IE, I used the IEroot hack explained here.

In particular, I was targeting IE 5.5, 6 and 7 separately by using the conditional statements

 

<!–[if lte IE 6]>  

<div id=”IEroot”>  

<![endif]–>

<!–[if IE 7]>  

<div id=”IEroot2″>  

<![endif]–>

 

Since I’m a macophile, I am using Virtual PC to see what my web pages look like in the window’s world.  I had no problem being able to see and alter the look of  the pages in IE 7, but when I went to alter the CSS values used to control the placement of elements in IE 6 and below, nothing happened.

What I eventually realized is that even though the placement of the html elements were showing up as they would in a typical IE 6 browser, the CSS used to control them was from the IEroot2 targeted for IE 7!!

It turns out that although the Multiple IE installer installed the earlier versions of IE explorer as it should, certain behavior of the earlier browsers still defaults to newer version, IE 7.  I briefly remember reading something about registers — unless my mind is confusing it with something else– needing to be set.

Since I was behind schedule and, as such, did not have the time to research the problem, I simply made a copy of the web page I was designing and CSS file that I was using to control.   I took that copy and  changed the CSS that was controlling IE 7, that is the IRoot2, and used it to make the necessary adjustments of the elements in IE 6.

More precisely, IEroot controls the CSS for IE 6 and below and IEroot2 controls the CSS for IE 7 in the originals files.  In the newly created files, IEroot2 now controls the CSS for IE 6 and below.

After I got IE 6 looking the way that I wanted by using the new files, I then copied those changes for IEroot2 back into the original CSS file into IEroot.  I know that this is extra work, but I was trying to make a deadline, so I used the first idea that popped into my head.   When I have the time to research a nicer solution without the copying back and forth, I’ll let you know.  But for a quick and dirty way to get around this problem, this technique will definitely work. 

 

Blogroll

Payin' Bills