CSS Probleme FF ok, IE funktioniert es nicht

N

napsi

Erfahrenes Mitglied
Habe folgendes Problem:
In einem anderen Threat wurde das problem mit dem z-index gelöst. aber jetzt funktioniert die navigation allerdings nicht mehr im IE.

ich habe die navigation von der seite:
http://www.cssplay.co.uk/menus/flyout2.html

die betroffene seite zur veranschaulichung:
http://www.kaschuetz.at/produkte.asp?item=2

ich finde aber den unterschied nicht. bitte um dringende hilfe, ich weiß nicht, was ich falsch gemacht habe.

Code: 
.menu {
z-index:1000;
font-size:90%;
margin:25px 0 50px 15px; /* this page only */
}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none;
width:150px;
}
/* hack for IE5.5 */
* html .menu ul {margin-left:-16px; ma\rgin-left:0;}
/* position relative so that you can position the sub levels */
.menu li {
position:relative;
background:#fff;
height:26px;
}

/* get rid of the table */
.menu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:10px;}

/* style the links */
.menu a, .menu a:visited {
display:block; 
text-decoration:none;
height:25px;
line-height:25px;
width:150px;
color:#f29400;
text-indent:5px;
border:0px solid #fff;
border-width:0 1px 1px 0;
}
/* hack for IE5.5 */
* html .menu a, * html .menu a:visited {background:#fff; width:150px; w\idth:149px;}
/* style the link hover */
* html .menu a:hover {color:#f29400; background:#949e7c;}

.menu :hover > a {
color:#807f84; 
background:#f29400;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
top:0;
left:150px; 
z-index: 2000;
color:#807f84;
}
/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul {
visibility:visible;
color:#807f84;
}

/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{
visibility:hidden;
}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{
visibility:hidden;
}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ 
visibility:visible;
}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul { 
visibility:visible;
}
</style>

HTML: 
<div id="contflinks">
		<a href="index.htm"><img src="img/hpelemente/logo.gif" alt="" border="0" style="position:relative; top:-7px; left:70px"></a>
		<p></p>	<div id="subnav">
<div class="menu">
	<ul>
		<li class="sub"><a href="#">euro<strong>therm</strong> »<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
			<ul class="sub">
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=2">euro<strong>therm</strong> 4</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=7">euro<strong>therm</strong> 6</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=8">euro<strong>therm</strong> 8</a></li>
            <li><a href="http://www.kaschuetz.at/produkte.asp?item=9">euro<strong>therm</strong> 10</a></li>
			<!--<li><a href="http://www.kaschuetz.at/produkte.asp?item=4">euro<strong>therm</strong> 11</a></li>-->
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=3">euro<strong>therm</strong> 12</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=11">euro<strong>therm</strong> Hinterlader</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=10">euro<strong>therm</strong> Tunnel</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=50">euro<strong>therm</strong> Slide</a></li>

		  </ul>
		</li>
		<li class="sub"><a href="#">euro<strong>matic</strong> »<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
			<ul>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=62">euro<strong>matik</strong> Luftkasten</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=61">euro<strong>matik</strong> Rohrklappe</a></li>

		  </ul>
		</li>	  	
        <li class="sub"><a href="#">euro<strong>flux</strong> »<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
			<ul>
			<!--<li><a href="http://www.kaschuetz.at/produkte.asp?item=4">euro<strong>flux</strong> 5</a></li>-->
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=6">euro<strong>flux</strong> 10</a></li>

		  </ul>
		</li>	
		<li class="sub"><a href="#">Heiztüren »<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
			<ul>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=48">kachelofentüren</a></li>
			<li class="sub"><a href="#">Türvariationen »<!--[if gte IE 7]><!--></a><!--<![endif]-->
			<!--[if lte IE 6]><table><tr><td><![endif]-->
				<ul>

					<li><a href="http://www.kaschuetz.at/produkte.asp?item=12">Elegance</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=14">Trend Radius 47/52 Radius 45</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=52">Aurea 44/52 Standard</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=57">Aurea 34/52 Standard</a></li>
					<!--<li><a href="http://www.kaschuetz.at/produkte.asp?item=11">Aurea 46/54 Standard</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=11">Aurea 36/54 Standard</a></li>-->
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=51">Aurea 46/54 Nische</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=59">Aurea 36/54 Nische</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=54">Aurea 44/52 Radius 35</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=53">Aurea 44/52 Radius 45</a></li>
					<!--<li><a href="http://www.kaschuetz.at/produkte.asp?item=11">Aurea 36/54 Radius 35</a></li>
					<li><a href="http://www.kaschuetz.at/produkte.asp?item=11">Sonderanfertigung</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 class="sub"><a href="#">Einbauzarge »<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
			<ul>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=28">Schamottezarge</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=60">Gusszarge</a></li>

		  </ul>
		</li>
        <li class="sub"><a href="#">Zubehör »<!--[if gte IE 7]><!--></a><!--<![endif]-->
		<!--[if lte IE 6]><table><tr><td><![endif]-->
			<ul>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=40">Nachheizkasten</a></li>
			<!--<li><a href="http://www.kaschuetz.at/produkte.asp?item=4">Rauchrohrartikel</a></li>-->
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=37">Einbaurahmen</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=4">Gussrohr</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=38">Aussenluftadapter</a></li>
			<li><a href="http://www.kaschuetz.at/produkte.asp?item=39">Flexrohre</a></li>

		  </ul>
		</li>
		<li><a href="http://www.kaschuetz.at/produkte.asp?item=55">MIO</a></li>
	</ul>
</div>
 
Und wieso übernimmst du nicht kurzerhand nochmal das funktionstüchtige Original-CSS und passt es auf deine Seitenverhältnisse an?! Bevor Dritte den Code nach deinen begangenen Fehlern durchforsten dürfen!
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück