• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

beim IE wird das aufklapp Menu nicht richtig angezeigt

Beagel

Neues Mitglied
Hallo zusammen,
hoffe ich bin hier richtig, da ich Anfänger in Sachen Homepage erstellen bin habe ich ein Problem mit dem IE in den Anderen Browsern klappt es so wie ich mir das vorstelle.
Das Problem beim IE wird das aufklappende Menu unter das daneben liegende Bild oder Schrift geschoben,
siehe www.dietersreisen.de/in.html
CSS Datei
Code:
body {
  border-color: #009900;
  border-width: 10px;
  margin: 0px auto;
  font-family: Verdana;
  font-size: 12px;
  text-align: left;
  width: 995px;
  background-color: #cccccc;
}
#title {
  border-color: #003300;
  padding: 5px;
  height: 44px;
  background-color: #7b7d8e;
  font-family: Times New Roman,Times,serif;
  font-style: italic;
  text-align: center;
  font-size: 19px;
  color: #ffffff;
  line-height: 227%;
}
* {
  margin: 0;
  padding: 0;
}
#mainBox
{
position: relative;
display: block;
background: #dfdfdf;
border-left: 170px solid #607b9e;
border-right: 170px solid #90abce;
}

#innerBox
{
display: block;
margin-left: -170px;
margin-right: -170px;
padding: 5px;
}

#leftBox
{
float: left;
position: relative;
width: 170px;
left: 0px;
}

#rightBox
{
float: right;
position: relative;
width: 160px;
right: 0px;
}

#centerBox
{
margin-left: 170px;
margin-right: 170px;
position: relative;
display: block;
height: 1%;
}

.clear
{
clear:both;
}


#menu {
  padding: 0 0px;
  width: 100%;
  font-family: Verdana;
  font-size: 1em;
  line-height: 1.5;
  margin-top: 15px;
}
#menu ul {
  list-style-type: none;
  width: 12em;
  padding-left: 10px;
}
#menu h3 {
  border: 1px solid #66ff99;
  background: blue none repeat scroll 0% 50%;
  font-size: 1em;
  text-align: center;
  color: #000000;
}
#menu a {
  border-style: solid;
  border-color: white black black white;
  border-width: 7px;
  background: silver none repeat scroll 0% 50%;
  text-decoration: none;
  display: block;
  text-align: center;
  color: black;
  font-weight: bold;
}
#menu a:hover {
  background: #003366 none repeat scroll 0% 50%;
  color: #ff9224;
}
#menu li {
  position: relative;
}
#menu ul ul {
  top: 0px;
  z-index: 2;
  display: none;
  position: absolute;
  left: 11em;
}
#menu ul li:hover ul {
  display: block;
}
* html #menu ul li {
  float: left;
  width: 100%;
}
* + html #menu ul li {
  float: left;
  width: 100%;
}
#menu a.direkt:link {
  border: 1px solid #66ff99;
  background: #ff8000 none repeat scroll 0% 50%;
  font-size: 1em;
  font-weight: bold;
  text-align: center;
  color: #000000;
}
#menu a.direkt:hover {
  border: 1px solid #cccccc;
  background: #003366 none repeat scroll 0% 50%;
  color: #ff9224;
}
#menu ul *:hover ul, #menu ul *:hover ul *:hover ul, #menu ul *:hover ul *:hover ul *:hover ul, #menu ul *:hover ul *:hover ul *:hover ul *:hover ul {
  left: 11em;
  top: -1px;
}
#menu ul *:hover ul ul, #menu ul *:hover ul *:hover ul ul, #menu ul *:hover ul *:hover ul *:hover ul ul {
  left: -9999px;
}

div#Rahmen {
  border-width: 10px;
  padding: 0.8em;
  background-color: #ffcc00;
  float: left;
  width: 658px;
}
* html div#Rahmen {
  border-color: #33ff33;
  border-width: 15px;
  float: left;
  width: 658px;
}
div#Rahmen div {
  float: left;
  width: 658px;
}
ul#Navi {
  margin: 0;
  padding: 0;
  text-align: center;
}
ul#Navi li {
  margin: 0.4em 0.1em;
  padding: 0;
  list-style-type: none;
  list-style-image: none;
  list-style-position: outside;
  float: left;
  width: 9.6em;
  text-align: left;
}
#Rahmen {
  border-color: #66ffff;
  border-width: 0px;
  padding: 0.8em;
  background-color: #ffcc00;
  width: 658px;
}
ul#Navi li ul li {
  float: none;
  display: block;
  margin-bottom: 0.2em;
}
ul#Navi a, ul#Navi span {
  border-style: solid;
  border-color: white black black white;
  border-width: 7px;
  padding: 0.2em 1em;
  text-decoration: none;
  font-weight: bold;
  color: black;
  background-color: #cccccc;
  display: block;
}
* html ul#Navigation a, * html ul#Navigation span {
  width: 6.4em;
}
ul#Navi a:hover, ul#Navi span, li a#aktuell {
  border-color: black white white black;
  color: white;
  background-color: gray;
}
li a#aktuell {
  color: maroon;
  background-color: #dcdcdc;
}
ul#Navi li ul span {
  border-color: blue;
}

p#Fusszeile {
  border-top: 1px solid silver;
  margin: 0;
  padding: 0.1em;
  clear: both;
  font-size: 0.83em;
  text-align: center;
  background-color: #ffeedd;
  width: 995px;
}
HTML Datei
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html
 lang="de-at"><head><title>Dietersreisen</title>

<meta name="language" content="deutsch">
<meta http-equiv="content-Type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="Easy Metaman Pro 1.0"> <link
 rel="stylesheet" type="text/css" href="aktuell.css"><link rel="shortcut icon" href="favicon.ico" /></head>
<body>
 <div id="body">
 <img src="Banner2.jpg" style="width: 995px; height: 139px;">
 <div id="title"><h1>Gitta`s und Dieter`s Reisen</h1>
</div>
<div id="mainBox">
<div id="innerBox">
       <div id="leftBox"><div id="menu">
<ul>
  <li><a id="aktuell" href="index.html">Home</a></li>
  <li><a href="nl.html">Niederlande</a><ul>
	    <li><a href="#">Flügeverfolgen</a></li></ul></li>
  <li><a href="paris.html">Frankreich</a></li>
  <li><a href="dublin.html">Irland</a></li>
  <li><a href="ca.html">Kanada</a></li>
  <li><a href="es.html">Spanien</a></li>
  <li><a href="usa.html">USA</a></li>
  <li><a href="#">Links</a>
    <ul>
      <li><a href="http://meine.flugstatistik.de/Beagel" target="_blank">Flugstatistik</a></li>
          <li><a href="links.html">Verschiedenes</a></li>
      <li><a href="#">Rund ums Fliegen</a><ul>
	    <li><a href="#">Flügeverfolgen</a></li></ul></li>
      </ul>
  </li>
  <li><a href="impressum.html">Impressum</a>
  </li>
</ul>
</div>
<a id="klickmonster-586850" href="http://www.klickmonster.de/">Counter</a><br>
<script type="text/javascript" language="JavaScript"
 src="http://www.klickmonster.de/show_free_counter.js.php?id=586850&amp;style=53"></script></div>
 
 <div id="rightBox">Test Feld</div>

 <div id="centerBox"><br><br><br><a
 href="http://www.flaggen-server.de/europa1/brd01.php" target="_blank"><img
 style="border: 0px solid ; width: 56px; height: 44px;" alt="flag1"
 src="dlandanim04.gif"> </a><br><br><br><big><big><big><span
 style="font-style:italic; font-weight: bold;">
Eine Webseite,mit kurzen
Reiseberichten, Info&acute;s
und <br>vielen Bildern.<small>(in Webalben, einfach
auf Bilder,Flaggen, Datum klicken.)</small><br>Einige
Bilder
sind geogetaggt und man kann direkt aus
dem Webalbum
auf die Karten kommen.</span>
</div><div class="clear"></div></div></div><p id="Fusszeile">letzte &Auml;nderung 06.01.2010</p></body></html>

Gruß Beagel
 
Zurück
Oben