Raistlin: Darstellung funktioniert im IE nicht richtig

Beitrag lesen

Hi!

Ich habe leider ein Probelm mit CSS: in allen Browsern (neueste Versionen) ausser dem Internet Explorer sieht mein Seitenlayout genauso aus wie ich es möchte. Das letzte "Inhalt" div mit float(right) ist genau dort wo es sein soll (unter dem Logo rechtsbündg). Nur IE macht es aus einem mir unbekannten Grund nicht. Beim IE liegt der "Inahlt" unter dem letzten links gefloatetem Listenelement. Ich habe es schon mit position versucht aber dann stellen es alle anderen Browser falsch dar.

Hier ist mal der Code:

  
  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">  
  
<html>  
  
<head>  
  
<title></title>  
  
<meta name="description" content="Dieser Beschreibungstext soll einem Anwender im Suchdienst bei Auffinden dieser Datei erscheinen.">  
  
<meta name="author" content="">  
  
<meta name="date" content="2006-03-15">  
  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
  
<meta http-equiv="expires" content="0">  
  
<style type="text/css"> /*Embedded Cascading Style Sheet*/  
  
  
  
  body {  
  
    color: black; background-color: white;  
  
    font-size: 100.01%;  
  
    font-family: Helvetica,Arial,sans-serif;  
  
    margin: 0; padding: 0;  
  
    text-align: left;  /* Zentrierung im Internet Explorer */  
  
    min-width: 40em; /* Mindestbreite verhindert Anzeigefehler in modernen Browsern */  
  
  }  
  
  
  div#Seite {  
  
text-align: left;  
  
vertical-align: top;  
  
margin: 0 auto;  
  
width: 800px;  
  
padding: 0;  
  
background: #cccccc;  
  
border: 2px ridge silver;  
  
/*height: auto;* unnötig?*/  
  
overflow: hidden;  
  
  }  
  
  
  h1 {  
  
    font-size: 1.5em;  
  
    margin: 0; padding: 0.2em 0.2em 0.1em 0.2em;  
  
    text-align: left;  
  
    background: #ffffff;  
  
    border-bottom: 1px solid silver;  
  
  }  
  
  
  div#Navilogo {  
  
float:left;  
  
width:160px;  
  
height: 240px;  
  
margin: 0px;  
  
padding: 0px;  
  
  }  
  
  
  ul#Navigation {  
  
font-size: 0em;  
  
float: left;  
  
margin: 0px;  
  
padding: 0px;  
  
list-style: none outside;  
  
width:80px;  
  
height: 25px;  
  
border: 0px none;  
  
  }  
  
  
  
  div#Inhalt {  
  
margin: 0;  
  
padding: 0 1em;  
  
float:right;  
  
width:526px;  
  
background-color: #fefafa;  
  
  }  
  
  
  
  * html div#Inhalt {  
  
    height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */  
  
    margin-bottom: 0;  
  
  }  
  
  
  
  div#Inhalt h2 {  
  
    font-size: 1.2em;  
  
    margin: 0.2em 0;  
  
    color: black;  
  
  }  
  
  
  
  div#Inhalt p {  
  
    font-size: 1em;  
  
    margin: 1em 0;  
  
  }  
  
  
  p#Fusszeile {  
  
    clear: both;  
  
    font-size: 0.6em;  
  
    margin: 0; padding: 0.1em;  
  
    text-align: center;  
  
    background-color: #fefafa;  
  
    border-top: 1px solid silver;  
  
  }  
  
  
</style>  
  
</head>  
  
<body>  
  
  
<div id="Seite">  
  
  <h1><img src="logo.png" alt="Logo"></h1>  
  
  
  
  <div id="Navilogo">  
  
  <img src="navigation.png" width="160" height="240" alt="Navigation Logo" border="0">  
  
  </div>  
  
  
  <div>  
  
  <ul id="Navigation">  
  
  <li><img src="naviempty.png" alt="White Spacer" vspace="0" border="0" width="80" height="25" hspace="0" style="position:relative; left: 0px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="135" height="25" border="0" style="position:relative; left: -55px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="120" height="25" border="0" style="position:relative; left: -40px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="105" height="25" border="0" style="position:relative; left: -25px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="90" height="25" border="0" style="position:relative; left: -10px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="80" height="25" border="0" style="position:relative; left: 0px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="85" height="25" border="0" style="position:relative; left: -5px; top:0px;"></li>  
  
  <li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="90" height="25" border="0" style="position:relative; left: -10px; top:0px;"></li>  
  
  </ul>  
  
  </div>  
  
  
  
  <div id="Inhalt">  
  
<h2>BLIBLABLUB</h2>  
  
    <p>Blablablablablablablablablablablab lablablablablablablablabladfgdfgdddf  
  
      fgdfgdgdf </p>  
  
    <p>Bla</p>  
  
    <p>Blablablablablablablalbalbalblabla blblbalblablablablablabla lballlb ablabl  
  
      albl alb labl alb labl alb alb lab labl alb alb lab lab lablab lablbl blblab  
  
      lblalbl alalb lablabl abl albl ablablblabl blalbl ablabl ablabl labla balb  
  
      lblbal ll alblabl blalbl lblabl labl albl abl </p>  
  
    <p>albl abl allbl lbalblalb labl bl lbal blal blal bla lb fffgdfgdlabl a</p>  
  
    <p>bl albl alb lalablalb labla llbal alblalalb lab lbbalbalalb lblalb lbal  
  
      lbllarfgbalsfjkhglkjasfdhgc oahg lhg lshghsigs sofhg lshg sdupgf phiuspug  
  
      sfpgu psfug spidfug ppisugpi puspigu psufdpigpipusgp rtl ehglksrtlwnrlnrwl  
  
      nwelknf lwrlfnwrwjfigfubopi rp pksjfpg wrj pw pw pig jwr jpi gj wrjk&ouml;gj  
  
      lkwpg wrpj pjpwrjg wripj gpwij pj pwrijg pwrj wprij gpwrgpij pwrj pwirj  
  
      pijpijwrpigj pwrij piwrjpgj pijwrpi jwrpi jpi  
  
  </div>  
  
  
  <p id="Fusszeile">© 2006 Impressum</p>  
  
  
</div>  
  
</body>  
  
</html>  

Ich wäre für jede Hilfe und Korrekturen sehr dankbar. Ich probiere da schon einige Stunden rum aber nichts funktioniert :(

Danke und bis dann,
Raist