Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 02.04.2005, 02:55
sAt. sAt. ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.03.2005
Beiträge: 14
sAt. befindet sich auf einem aufstrebenden Ast
Standard Anordnung von Submenüelementen...

Kurz und bündig:

Das ist die Seite: http://satdot.com/projekt/test/ie/layout1.htm

Im FF werden die Untermenüelemente richtig nebeneinander dargestellt, im IE werden sie untereinander dargestellt.

Kann mir jemand sagen, wie ich es auch im IE schaffe, diese nebeneinander darstellen zu lassen?

CSS:
Code:
html {
	height:100%;
	max-height:100%;
	overflow:hidden;
	padding:0;
	margin:0;
	border:0;
	background:rgb(209,205,193);
	font-size:76%;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	}

body {
	height:100%;
	max-height:100%;
	overflow:hidden;
	padding:0;
	margin:0;
	border:0;
	background:rgb(209,205,193);
	}

#content {
	display:block;
	overflow:auto;
	position:absolute;
	z-index:3;
	top:125px;
	bottom:52px;
	width:750px;
	margin-left:-376px;
	left:50%;
	border-left:1px solid #000;
	border-right:1px solid #000;
	background:#fff;
	}

* html #content {
	top:0;
	bottom:0;
	height:100%;
	width:752px;
	border-top:129px solid #fff;
	border-bottom:50px solid #fff;
	}

#head {
	background-image:url(header.jpg);
	position:absolute;
	margin-left:-376px;
	left:50%;
	top:0;
	width:750px;
	min-width:750px;
	height:125px;
	background-color:lightblue;
	font-size:1em;
	z-index:5;
	border:1px solid #000;
	}

* html #head {
	top:2px; width:752px; height:98px;
	}

* html #space {width:750px; height:25px; padding:0; position:absolute; margin:0; background-image:url(header.jpg); background-repeat:no-repeat; background-position:0% 100%; border-bottom:1px solid black;}

#menu {
	background-image:url(header.jpg);
	position:relative;
	margin-top:75px;
	margin-left:-375px;
	left:50%;
	top:0;
	width:750px;
	height:50px;
	background-color:lightblue;
	background-image:url(header.jpg);
	background-repeat:no-repeat;
	background-position:0% 100%;
	font-size:1em;
	z-index:5;
}

* html #menu {
    width:750px;
	height:50px;
	margin-left:-375px;
	}


#navlist
{
background:lightblue;
height:25px;
border-top:1px solid black;
border-bottom:1px solid black;
margin:0;
padding:0;
margin-top:0px;
}

#navlist ul
{
padding:0;
margin:0;
list-style:none;
}

#navlist li
{
float: left;
margin: 0px;
padding: 0px;
list-style: none;
display:inline;
}

#navlist li a:link, #navlist li a:visited
{
font-size:1em;
font-weight:bold;
color:#000;
text-decoration:none;
text-align:center;
line-height:25px;
height:25px;
display:block;
overflow:hidden;
text-align:center;
width:150px;
}

#navlist li a:hover, #navlist li a:active
{
background:orange;
width:150px;
}

#navlist li:hover ul {left:0;}
#navlist li.msieFix ul {left:0;}

#navlist li ul
{
position:absolute;
left:-2000px;
width:100%;
}

.space2 {
	display:inline;
	float:left;
	height:25px;
	width:150px;
	}

#navlist ul a:link, #navlist ul a:visited
{
}

#navlist ul a:hover, #navlist ul a:active
{
background:blue;
}


#foot {
	text-align:center;
	position:absolute;
	margin-left:-376px;
	left:50%;
	bottom:0;
	width:750px;
	min-width:750px;
	height:50px;
	background:url(header2.jpg); background-position:0 100px;
	font-size:1em;
	z-index:5;
	border:1px solid #000;
	font-family: trebuchet MS, tahoma, verdana, arial, sans-serif;
	font-weight:bold;
	color:#000;
	}

* html #foot {
	bottom:2px; width:752px; height:48px;
	}


#content p {
	padding:5px; text-align:justify;
	}
.boldhead {
	font-size:1.5em;
	font-weight:bold;
	}
.bold {font-weight:bold;}
.left {float:left; margin:10px; border:1px solid #000;}
.right {float:right; margin:10px; border:1px solid #000;}
.lefttext {float:left; width:300px; text-align:justify;}
.righttext {float:right; width:300px; text-align:justify;}

* html .lefttext {float:left; width:310px; text-align:justify;}
* html .righttext {float:right; width:310px; text-align:justify;}
HTML:
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" >

   <head>
      <title>Layout 1</title>
      <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />

      
      <style type="text/css" media="screen">
  	  
      </style>
      
	  <link rel="stylesheet" href="msie.css" type="text/css" />
	  
	  <script type="text/javascript">
		<!--
			if(document.styleSheets) document.styleSheets[1].disabled=true
		//-->
	  </script>
	  
	  <script type="text/javascript">
		<!--// Setting the Event Handlers Dinamically
		function swap(){this.className="msieFix"}
		function swapBack(){this.className="trigger"}
		function TJKSetEvents(){
		var l = document.getElementsByTagName("li");
		var lA= l.length;
			for(var i=0;i<lA;i++){
			if(l[i].className=="trigger"){
				l[i].onmouseover=swap;
				l[i].onfocus=swap;
				l[i].onmouseout=swapBack;
				l[i].onblur=swapBack;
				}
			}
		}
		//-->
	  </script>
	  
	  <!--[if IE 5]>
	  <style type="text/css" media="screen">
	  * html #navlist li ul {top:2.2em}
	  * html #navlist li ul li a {line-height:1.4em;height:1.4em}
      </style>
	  <![endif]-->
	  
	</head>

 	<body onload="TJKSetEvents()">
   
	<noscript>
	<!--[if IE 5]>
	<style type="text/css" media="screen">
	* html #navlist li ul {top:0}
	* html #TJKDDM #current ul {top:0}
	* html #navlist ul a:hover {line-height:17px}
	</style>
	<![endif]-->
	</noscript>
   
   	<div id="head">
   	
   	    <div id="menu">
   		
   	    <ul id="navlist">
  			[*]Aktuelles
			<li class="trigger">Ressorts
			    <ul>
			[*]Bildende Kunst
			[*]Literatur
			[*]Musik
			[*]Film
			[*]<span class="space2"></span>
				[/list]			
			[*]Künstler
			[*]Projekte
			<li class="trigger">Information
				<ul>
				[*]<span class="space2"></span>
				[*]<span class="space2"></span>
			[*]Grundsätze
			[*]Entstehung
			[*]Kontakt</style>
				[/list]			
		[/list]		
		</div>
		


	</div>
   
   	<div id="content">
		

Inhalt
Inhalt
Inhalt
Inhalt
Inhalt
Inhalt
Inhalt
Inhalt
...</p>
	</div>
	
    <div id="foot">
    	Menü
    </div>
	</body>
</html>
Mit Zitat antworten
Sponsored Links