Ingo Siemon: Vertikaler Abstand zwischen Links

Beitrag lesen

Guten Tach

Ich habe die Navigation meiner Seite mit einer Liste (ul) realisiert.
Nun sind aber zwischen den einzelnen Links so
merkürdige horizontale Abstände.
Diese sind nur im Internet Explorer zu sehen.
Mit FireFox und Opera ist alles OK.

Hat jemand von Euch eine Idee, wo ich da den Fehler gemacht habe.
Laut den diversen Validatoren ist ales valide.

Gruß
Ingo

Hier mal der Quelltext der Seite:

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">  
  
  <head>  
    <meta name="description" content="Versandhandel für Science Fiction + Erotik Modelle und hochwertige Film-Schwerter. Über 1500 Artikel im Programm." />  
    <meta name="keywords" content="SPACEart, Versandhandel, Science Fiction, Fantasy, Action, Horror, Modellbau, Modellbausatz, Modell-Bausatz, Figuren, Schwert, Alien, Predator" />  
    <meta http-equiv="imagetoolbar" content="no" />  
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />  
    <meta http-equiv="content-script-type" content="text/javascript" />  
    <link rel="shortcut icon" href="favicon.ico" />  
    <link rel="alternate" type="application/rss+xml" title="RSS-Newsfeed" href="http://SPACEart.de/SPACEart.xml" />  
    <link rel="stylesheet" type="text/css" href="css.css" />  
    <link rel="stylesheet" media="print" href="css-druck.css" />  
    <title>SPACEart - Science Fiction + Erotik Modelle</title>  
  </head>  
  
  <body>  
    <div id="Seite">  
  
      <ul id="Navigation">  
        <li><a href="xxxxx">Action + Horror Modelle</a></li>  
        <li><a href="xxxxx">Erotik Modelle</a></li>  
        <li><a href="xxxxx">SciFi + Fantasy Modelle</a></li>  
        <li><a href="xxxxx">Schwerter + Dolche</a></li>  
        <li><a href="xxxxx">Zubehör</a></li>  
        <li><a href="xxxxx">Bemal-Service</a></li>  
        <li><a href="xxxxx">Warenkorb</a></li>  
        <li><a href="xxxxx">AGB + Hilfe</a></li>  
        <li><a href="xxxxx">Bildschirmschoner</a></li>  
        <li><a href="xxxxx">F.A.Q.</a></li>  
        <li><a href="xxxxx">Impressum</a></li>  
        <li><a href="xxxxx">Kontakt + E-Mail</a></li>  
        <li><a href="xxxxx">Newsletter + RSS</a></li>  
        <li><a href="xxxxx">Rückruf-Service</a></li>  
        <li><a href="xxxxx">Spiel</a></li>  
        <li><a href="xxxxx">Such-Service</a></li>  
        <li><a href="xxxxx">Werbung</a></li>  
      </ul>  
  
      <div id="Inhalt">  
        <h1>SciFi + Fantasy Modelle</h1>  
        <h2>Muster-Filmtitel</h2>  
        <div class="box"><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p></div>  
        <h2>Muster-Filmtitel</h2>  
        <div class="box"><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p></div>  
        <h2>Muster-Filmtitel</h2>  
        <div class="box"><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p></div>  
        <h2>Muster-Filmtitel</h2>  
        <div class="box"><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p><p>hjifghdsgphdfsup hgufip hugpf dh ghupf dhug pf hgu fhdpu hgupf hdup ghf dhpgh udipg ufdpguf phgph upfh gu fhugpfsd hguipf dhg iupf hgf hg fui ghf gp ufps hgupfpdishgpf dhsug ufd shpgh fdsp ghuf psg huifp hgup fhdpsg upif psghuf dpsghfps hgupifhughpidf hsg fp hgifpshg upfid hgpdif ghidfs ghpf dsgh fdpsghfhdspgh</p></div>  
      </div>  
  
      <p id="Fusszeile">&nbsp;</p>  
    </div>  
  </body>  
  
</html>  

Und hier die dazugehörige CSS-Datei:

  
/* Dunkelgrau: #3d3d3d;  */  
/* Mittelgrau: #d5d5d5;  */  
/* Hellgrau: #eee;  */  
  
/* Blau: #0032b2;  */  
/* Rot: #6d2323;  */  
/* Dunkelblau: #0f255c;  */  
  
  
  
body {  
  background: #d5d5d5 url(bilder/hintergrund.gif);  
  color: #3d3d3d;  
  font: 95% Helvetica, Arial, sans-serif;  
  text-align: center;  /* Zentrierung im Internet Explorer */  
  padding: 1em;  
}  
  
div#Seite {  
  text-align: left;    /* Seiteninhalt wieder links ausrichten */  
  margin: 0 auto;      /* standardkonforme horizontale Zentrierung */  
  width: 776px;  
  border: 1px solid #3d3d3d;  
  background: #eee url(bilder/hintergrund-navigation.gif) repeat-y;  
  }  
  
ul#Navigation {  
  float: left;  
  width: 220px;  
  padding: 0 10px 0 10px;  
  margin: 0;  
  overflow: hidden;  
  }  
ul#Navigation li {  
  list-style: none;  
  }  
ul#Navigation a {  
  display: block;  
  }  
ul#Navigation a:link {  
  color: #0f255c;  
  }  
ul#Navigation a:visited {  
  color: #0f255c;  
  }  
ul#Navigation a:hover {  
  color: #6d2323;  
  }  
ul#Navigation a:active {  
    color: #6d2323;  
  }  
  
div#Inhalt {  
  margin: 0 0 0 250px;  
}  
* html div#Inhalt {  
  height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */  
}  
div#Inhalt h1,h2 {  
  font-size: 1.5em;  
  background: #d5d5d5;  
  border: 1px solid #3d3d3d;  
  padding: 3px;  
  margin: 10px 0 0 0;  
  width: 502px;  
  overflow: hidden;  
}  
div#Inhalt h2 {  
  font-size: 1.1em;  
  margin: 20px 0 0 0;  
}  
div#Inhalt .box {  
  background: #d5d5d5;  
  border: 1px solid #3d3d3d;  
  padding: 3px;  
  margin: 7px 0 0 0;  
  width: 502px;  
  overflow: hidden;  
}  
  
p#Fusszeile {  
  clear: both;  
}