CSS display Funktion

[Johann]

Hallo Mathias,

ich habe in der zwischen zeit das Problem halbwegs gelöst. Undzwar habe ich ein dickes Problem.

Der Code:

  
<style type="text/css">  
#linkbir{padding:0px; margin:0px; float:left; list-style-type:none;}  
#linkbir a{padding:7px 7px; display:block; background:white url(lbcizgia.gif) no-repeat center; font:13px Tahoma; color:#FFFFFF; text-decoration:none;}  
#linkbir ul{margin:0; padding:0; float:left; position:absolute; display:none;}  
#linkbir li{padding:0; margin:0; float:left; position:relative; display:block; list-style:none;}  
#linkbir li a:hover{padding:7px 7px; display:block; background:white url(lbcizgihover.gif) no-repeat center; font:13px Tahoma; color:#FFFFFF; text-decoration:none;}  
#linkbir li a:visited, #linkbir li a:active{color:#FFFFFF;}  
#linkbir li ul{display:none;}  
#linkbir li ul a{padding:7px 0px; display:block; background:white url(cizgi.gif) repeat-y left top; font:13px Tahoma; color:#FFFFFF; text-decoration:none; text-indent:7px;}  
#linkbir li ul a:hover{background:white url(cizgi.gif) repeat-y; background-position:-387px 0px; color:#FFFFFF; text-indent:0px;}  
#linkbir li:hover ul{display:block;}  
#linkbir li:hover ul ul{position:absolute; display:none;}  
#linkbir li ul:hover ul{display:block;}  
  
.lbeins{width:200px;}  
.lbzwei{width:100px;}  
</style>  
  
<!--[if IE]>  
<style type="text/css">  
p.iepara{padding-top: 1em;}  
</style>  
<![endif]-->  
  
<div>  
<table cellspacing="0" align="center">  
<tr>  
<td>  
<ul id="linkbir">  
<li><a href="http://www.misafir.taskiranvecevresi.com/">Ana Sayfa</a></li>  
<li><a href="uyeol.php">Üye Ol</a></li>  
<li><a href="#">Derne&#287;imiz &#9660;</a>  
	<ul>  
	<li class="lbzwei"><a href="tarihce.php">Tarih&#231;e</a></li>  
	<li class="lbzwei"><a href="amaclar.php">Ama&#231;lar</a></li>  
	<li class="lbzwei"><a href="tuzuk.php">Tüzük</a></li>  
	<li class="lbzwei"><a href="http://www.taskiranvecevresi.com/PDF/uyeformu.pdf" target="_blank">Üye Formu</a></li>  
	<li class="lbzwei"><a href="http://www.taskiranvecevresi.com/PDF/cikisformu.pdf" target="_blank">&#199;&#305;k&#305;&#351; formu</a></li>  
	<li class="lbzwei"><a href="kunye.php">Künye</a></li>  
	</ul>  
</li>  
<li><a href="siteyonetimi.php">Site Yönetimi</a></li>  
<li><a href="#">Yönetim Kurulu &#9660;</a>  
	<ul>  
	<li class="lbeins"><a href="yku.php">Yönetim Kurulu Üyeleri</a></li>  
	<li class="lbeins"><a href="ykk.php">Yönetim Kurulu Kararlar&#305;</a></li>  
	</ul>  
</li>  
<li><a href="#">Denetleme Kurulu &#9660;</a>  
	<ul>  
	<li class="lbeins"><a href="dku.php">Denetleme Kurulu Üyeleri</a></li>  
	<li class="lbeins"><a href="dkr.php">Denetleme Kurulu Raporlar&#305;</a></li>  
	</ul>  
</li>  
<li><a href="faaliyetler.php">Faaliyetler</a></li>  
<li><a href="videolar.php">Videolar</a></li>  
<li><a href="fotografalbum.php">Foto&#287;raf Albümü</a></li>  
<li><a href="#">&#304;leti&#351;im &#9660;</a>  
	<ul>  
	<li class="lbzwei"><a href="webposta.php">Bize Ula&#351;&#305;n</a></li>  
	<li class="lbzwei"><a href="muracaatlar.php">Müracaatlar</a></li>  
	</ul>  
</li>  
</ul>  
</td>  
</tr>  
</table>  
</div>  
  
  
<script type="text/javascript">  
var linkbir = document.getElementById("linkbir").getElementsByTagName("ul");  
	for (i=0;i<linkbir.length;i++)  
	{  
	linkbir[i].setAttribute("id","linkbir"+i)  
		if (linkbir[i].parentNode.nodeName == "LI")  
		{  
		linkbir[i].parentNode.onmouseover = function ()  
			{  
			this.lastChild.style.display = "block";  
			}  
		linkbir[i].parentNode.onmouseout = function ()  
			{  
			this.lastChild.style.display = "none";  
			}  
		}  
	}  
</script>  

funktioniert wunderbar auf mein Rechner zuhause. Genauso wie ich es haben will. Aber wenn ich diesen Link auf mein Webserver hochlade, sind die Untermenüs nicht untereinander sondern nebeneinander in einer Reihe.

FireFox zeigt total was anderes an.....

Wo könnte mein Fehler stecken?

Vielen Dank.
Johann