conflict with internet explorer

[niche]

I'm studying this script from cssplay. It works fine in firefox and internet explorer 8 on the cssplay site, but not in internet explorer 8 when I try to run on my localhost (works fine on firefox on my localhost). It's has comments that refer to use with internet explorer that I don't understand. What do you think they mean (how to rewrite it based on comments)?Here's a script fragment as a sample:

<li><a class="fly" href="#url">Contact Us<!--[if gte IE 7]><!--></a><!--<![endif]-->		<!--[if lte IE 6]><table><tr><td><![endif]-->			<ul>				<li><a href="#url">Email</a></li>				<li><a href="#url">Telephone</a></li>				<li><a href="#url">Online Form</a></li>				<li><a href="#url">Snail Mail Address</a></li>			</ul>		<!--[if lte IE 6]></td></tr></table></a><![endif]-->		</li>

[niche]

here's the entire script (it works on firefox, but not on IE8

<style type="text/css">#menu {height:132px; width:132px; position:relative;}#menu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left; padding:1px 1px 0 1px; background:#fff;}#menu li {margin:0; padding:0; list-style:none;}#menu li {display:inline;}#menu ul ul {position:absolute; left:-9999px;}#menu ul#toplevel {position:absolute; left:0; top:0;}#menu a {display:block; font:normal 11px verdana,arial,sans-serif; color:#000; line-height:22px; text-decoration:none;padding:0 20px 0 10px;} #menu li a.fly {background: url(anywidth/arrow.gif) no-repeat right top;}#menu li a:hover {background-color:#09c; color:#fff;} #menu li:hover > a {background-color:#09c; color:#fff;}#menu ul li:hover > ul {left:100%; margin-top:-23px; margin-left:-1px;}#menu a:hover ul,#menu a:hover a:hover ul, #menu a:hover a:hover a:hover ul {left:100%;}#menu a:hover ul ul, #menu a:hover a:hover ul ul {left:-9999px;}#menu table {position:absolute; left:99%; height:0; width:0; border-collapse:collapse; margin-top:-7px; margin-left:-1px;}</style><div id="info"><h2>A CSS only flyout - the basics</h2><h3>5th August 2009</h3><h3>12th December 2009 - simplified</h3><div id="menu">	<ul id="toplevel">		<li><a href="#url">Home</a></li>		<li><a class="fly" href="#url">Contact Us<!--[if gte IE 7]><!--></a><!--<![endif]-->		<!--[if lte IE 6]><table><tr><td><![endif]-->			<ul>				<li><a href="#url">Email</a></li>				<li><a href="#url">Telephone</a></li>				<li><a href="#url">Online Form</a></li>				<li><a href="#url">Snail Mail Address</a></li>			</ul>		<!--[if lte IE 6]></td></tr></table></a><![endif]-->		</li>		<li><a class="fly" href="#url">Resort<!--[if gte IE 7]><!--></a><!--<![endif]-->		<!--[if lte IE 6]><table><tr><td><![endif]-->			<ul>				<li><a href="#url">Ski Hire Facilities</a></li>				<li><a class="fly" href="#url">Main Ski Slopes<!--[if gte IE 7]><!--></a><!--<![endif]-->				<!--[if lte IE 6]><table><tr><td><![endif]-->					<ul>						<li><a href="#url">Beginners Slopes</a></li>						<li><a href="#url">Intermediate Slopes</a></li>						<li><a class="fly" href="#url">Advanced Skill Levels<!--[if gte IE 7]><!--></a><!--<![endif]-->						<!--[if lte IE 6]><table><tr><td><![endif]-->							<ul>								<li><a href="#url">Local</a></li>								<li><a href="#url">Nearby</a></li>								<li><a href="#url">With instructor</a></li>								<li><a href="#url">Snow boarding</a></li>							</ul>						<!--[if lte IE 6]></td></tr></table></a><![endif]-->						</li>						<li><a href="#url">Expert</a></li>					</ul>				<!--[if lte IE 6]></td></tr></table></a><![endif]-->				</li>				<li><a href="#url">Night Life</a></li>				<li><a class="fly" href="#url">Restaurants<!--[if gte IE 7]><!--></a><!--<![endif]-->				<!--[if lte IE 6]><table><tr><td><![endif]-->					<ul>						<li><a href="#url">Snow Hotel</a></li>						<li><a href="#url">The Snowman</a></li>						<li><a href="#url">Ice Cavern</a></li>						<li><a href="#url">Ski Inn</a></li>					</ul>				<!--[if lte IE 6]></td></tr></table></a><![endif]-->				</li>				<li><a class="fly" href="#url">Car Hire<!--[if gte IE 7]><!--></a><!--<![endif]-->				<!--[if lte IE 6]><table><tr><td><![endif]-->					<ul>						<li><a href="#url">From Airport</a></li>						<li><a href="#url">In Resort</a></li>						<li><a href="#url">Multiple Resorts</a></li>					</ul>				<!--[if lte IE 6]></td></tr></table></a><![endif]-->				</li>			</ul>		<!--[if lte IE 6]></td></tr></table></a><![endif]-->		</li>		<li><a class="fly" href="#url">Information<!--[if gte IE 7]><!--></a><!--<![endif]-->		<!--[if lte IE 6]><table><tr><td><![endif]-->			<ul>				<li><a href="#url">Money Exchange</a></li>				<li><a class="fly" href="#url">Resort Essential Information<!--[if gte IE 7]><!--></a><!--<![endif]-->				<!--[if lte IE 6]><table><tr><td><![endif]-->					<ul>						<li><a href="#url">Lift Passes</a></li>						<li><a href="#url">Insurance</a></li>						<li><a class="fly" href="#url">Gear Rental<!--[if gte IE 7]><!--></a><!--<![endif]-->						<!--[if lte IE 6]><table><tr><td><![endif]-->							<ul>								<li><a href="#url">Boots</a></li>								<li><a href="#url">Skis</a></li>								<li><a href="#url">Ski Wear</a></li>								<li><a href="#url">Goggles</a></li>							</ul>						<!--[if lte IE 6]></td></tr></table></a><![endif]-->						</li>						<li><a href="#url">Ski Schools</a></li>						<li><a href="#url">Snow Report</a></li>					</ul>				<!--[if lte IE 6]></td></tr></table></a><![endif]-->				</li>				<li><a class="fly" href="#url">Language<!--[if gte IE 7]><!--></a><!--<![endif]-->				<!--[if lte IE 6]><table><tr><td><![endif]-->					<ul>						<li><a href="#url">Austrian</a></li>						<li><a href="#url">German</a></li>						<li><a href="#url">French</a></li>						<li><a href="#url">English</a></li>					</ul>				<!--[if lte IE 6]></td></tr></table></a><![endif]-->				</li>				<li><a href="#url">Short Breaks</a></li>			</ul>		<!--[if lte IE 6]></td></tr></table></a><![endif]-->		</li>		<li><a class="fly" href="#url">Surrounding Area<!--[if gte IE 7]><!--></a><!--<![endif]-->		<!--[if lte IE 6]><table><tr><td><![endif]-->			<ul>				<li><a href="#url">Where to go</a></li>				<li><a href="#url">What to do</a></li>				<li><a href="#url">Places of interest</a></li>				<li><a href="#url">National parks & Museums</a></li>			</ul>		<!--[if lte IE 6]></td></tr></table></a><![endif]-->		</li>		<li><a href="#url">Privacy</a></li>	</ul></div>

:

[wirehopper]

This tag will force IE8 to act like IE7 ...<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

[thescientist]

and just to add, the parts that you don't understand are what are known as conditional comments. Basically, they're "logic" statements directed at particular browsers so that depending on the user agent, certain code will be rendered vs other blocks of code.

[niche]

I've never heard of conditional comments. This stuff keeps getting deeper. That means I have to read-up on it before I can ask more questions. justsomeguy's quote keeps coming back about who makes the best programmers.Special thanks to wirehopper and thescientist. Who are among the real job dynamos in the world.Niche