Bin am Verzweifeln ... CSS-Navi Darstellungsproblem mit ie6

cube82

cube82

Mitglied
Thread Starter
Dabei seit
17.05.2005
Beiträge
39
Reaktionspunkte
0
Hallo Leute!
kann mir jemand helfen?!
Ich komme einfach nicht weiter.

Folgende Navigation hätte ich mir für eine Website überlegt.

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
	<title>TEST menu</title> 
<style type="text/css" media="screen">
	ul#mainnav
	{
		MARGIN: 0px 0px 0px 25px;
		padding: 0px;
	}

	ul#mainnav li
	{
  		list-style: none;
	}
		
	ul#mainnav a, ul#mainnav span
	{
		TEXT-ALIGN: center;
		text-decoration: none;
		FONT-SIZE: 19px;
		FONT-WEIGHT: bold;
		color: #ff00ff;
    	float: left;		
    	width: 200px;
		height: 25px;
		border-left: 1px solid #191919;
	}
  
	ul#mainnav a:hover
	{
		width: 200px;
		height: 25px;
		VERTICAL-ALIGN: middle;
	}
	
	ul#mainnav .menu1 a:hover, ul#mainnav .menu1 span
	{
		background-color: yellow;
	}
	
	ul#mainnav .menu2 a:hover, ul#mainnav .menu2 span
	{
		background-color: blue;
	}	

	ul#mainnav .menu3 a:hover, ul#mainnav .menu3 span
	{
		background-color: green;
	}

	ul#mainnav .menu4 a:hover, ul#mainnav .menu4 span
	{
		background-color: red;
	}

	ul#mainnav .menu4 a
	{
		border-right: 1px solid #191919;
	}
	
/*
	* html ul#mainnav a, * html ul#mainnav span
	{
		width: 190px;
		w/idth: 200px;
	}

	* html ul#mainnav a:hover
	{
		width: 190px;
		w/idth: 200px;
	}
*/
</style>
</head>
<body>

			<ul id="mainnav">
				<li CLASS="menu1"><a href="#">Menu1</a></li>
				<li CLASS="menu2"><span>Menu2</span></li>
				<li CLASS="menu3"><a href="#">Menu3</a></li>
				<li CLASS="menu4"><a href="#">Menu4</a></li>
			</ul>			

</body>
</html>

Im Firefox und im Safari sieht dies auch so aus wie ich will! Nur im ie6 eben nicht!
Es rutschen die einzelnen Menüpunkte um eine halbe Zeile nach unten. Was kann man da tun??

bitte helft mir...

danke, mfg
Chris
 
Bekannter IE-Bug: Schreibe die gesamte <ul><li>[…]</ul> in eine Zeile.

Es gibt noch einen Workaround, ich glaube der ging so, dass Du width:1% für <li>-Tags im CSS angibst. Aber da müsstest Du noch mal googlen.
 
Zurück
Oben Unten