tattergreis: Anzeigeproblem eines DIVs im FF

Hi allerseits!

Eigentlich mag ich’s nicht sonderlich wenn jemand seinen Quelltext posted und der Helfer sich da durchackern muss, aber mir bleibt nichts anderes mehr übrig. Ich hab auch alles Unnötige rausgestrichen, damit es nicht allzu lange wird. Wie es aussieht seht ihr hier:
http://tattergreis.ta.funpic.de/gbtest.html

Beim betrachten mit dem (alten) IE 6 wird alles korrekt angezeigt. Leider wird der erste Gästebucheintrag (welcher normalerweise halt von php erzeugt wird) der sich rechts vom Menü befindet auseinander gerissen wenn man sich die Seite im FF 2.0.0.2 anschaut.

Ich finde leider keine Lösung wie ich den "Anzeigefehler" in FF beheben kann. Kann mir jemand helfen?

Danke im Voraus!
tattergreis

Hier noch der Quelltext:
<!doctype html public "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
       <title>Title here!</title>
</head>
    <link rel="stylesheet" type="text/css" href="css2.css">
<style type="text/css">
html {
 background-color: lightgreen;
}

#container {
 width: 800px;
 padding:0px;
 margin: 0px;
 margin-left: auto;
 margin-right: auto;
}

h2 {
 font-size:20px;
 padding: 20px 0 5px 10px;
 margin:0px;
}

#outer{
 border-left: solid 200px #f1f1ff;    /* linke Menue Spalten Farbe  */
 background-color: #ffffff;   /* Farbe fuer Inhalt Spalten  */
}

#inner{
 margin:0px; width:100%;  /* die IE PC schlaufe */
}

#left {
 width:190px;
 float:left;
 position:relative;
 margin-left:-200px;
 margin-right:1px;
 list-style-type:none;
}

#menu{
 color:black;
 background:#f1f1ff;
 padding:10px;
}

#menu .liste{
 list-style-type: none;
 margin:0px;
 padding:0px;
}

#content{
 position: relative;
 margin: 0px;
}

.box1 {
 width:550px;
 margin-left:10px;
}

.box2, .box3, .box4 {
 padding:5px;
 margin:0;
 width:100%;
 border-right:2px solid #837c6b;
}

.box2, .box4 {
 border-bottom:1px solid #837c6b;
}

.box2 {
 height:40px;
 background-color:#f1f1ff;
}

.box3 {
 clear:both;
}

.box4 {
 text-align:right;
 font-size:9;
}
</style>
<body>
<div id="container">
 <div id="outer" >
   <div id="inner">
    <div id="left" ><h2>Men&uuml;</h2>
     <div id="menu">
    <ul class="liste">
     <li>Aktuell</li>
     <li>Restaurant</a></li>
     <li>Speis & Trank</a></li>
     <li>Bluemä Staff</a></li>
     <li>Geschichte</a></li>
     <li>Bildergalerie</a></li>
     <li>Interaktiv</a></li>
    </ul>
    </div>
      </div>
      <div id="content" >
   <h2>G&auml;stebuch</h2><br />
    <div class="box1">
     <div class="box2">
     Von <a href="mailto:gruenesmonsta@hogan.com"><b>hulk hogan</b></a> aus Wathackagucku am 30.03.2007 09:36<br />
      Homepage: <a href="http://www.google.com">www.google.com</a>
       </div>
       <div class="box3">Ach wieso hats denn nun das von Marius Müller so scheisse angezeigt?!</div>
       <div class="box4">128.34.243.654</div>
    </div><br /><br />
    <div class="box1">
       <div class="box2">
     Von <a href="mailto:t0u3rwf@gmx.ch"><b>Toni Mueller</b></a> aus hombi am 12.03.2007 00:00<br />
     Homepage: <a href="http://www.tonimuell.ch">www.tonimuell.ch</a>
      </div>
      <div class="box3">DasistnureinTest2</div>
      <div class="box4">182884749</div>
    </div><br />
    <p><a href="interaktiv.html">Zur&uuml;ck</a></p>
    <br><br>
   </div><!-- end content -->
  </div><!-- end inner -->
 </div><!-- end outer -->
</div><!-- end container -->
</body>
</html>

  1. Hallo,

    Ich finde leider keine Lösung wie ich den "Anzeigefehler" in FF beheben kann. Kann mir jemand helfen?

    Hier noch der Quelltext:
    <!doctype html public "-//W3C//DTD HTML 4.0 //EN">

    ^IE im Quirks-Mode. Warum?              ^HTML 4.0? Warum?

    .box3 {
    clear:both;
    }

    Wozu ist das clear:both bei .box3 nötig? Es sorgt hier dafür, dass das DIV.box3 _unter_ dem DIV#left beginnen muss.

    viele Grüße

    Axel

    1. <!doctype html public "-//W3C//DTD HTML 4.0 //EN">
         ^IE im Quirks-Mode. Warum?              ^HTML 4.0? Warum?

      Ups! Schande über mein Haupt. :/

      .box3 {
      clear:both;
      }
      Wozu ist das clear:both bei .box3 nötig? Es sorgt hier dafür, dass das DIV.box3 _unter_ dem DIV#left beginnen muss.

      Oh mann! Daran hab ich echt nicht gedacht. Selten doofer Fehler.

      Dankeschön!!

      gruss
      tattergreis

      1. Hallo,

        <!doctype html public "-//W3C//DTD HTML 4.0 //EN">
           ^IE im Quirks-Mode. Warum?

        Korrektur. Offensichtlich schickt diese komische Dokumenttyp-Deklaration den IE nicht in den Quirks-Mode. Trotzdem würde ich eine korrekte Angabe empfehlen http://de.selfhtml.org/html/allgemein/grundgeruest.htm#dokumenttyp.

        viele Grüße

        Axel

        1. Hallo,

          Trotzdem würde ich eine korrekte Angabe empfehlen http://de.selfhtml.org/html/allgemein/grundgeruest.htm#dokumenttyp.

          Hi!

          Ist längst erledigt. Danke! ;)... das kam nichtmal von mir... sondern von maguma. Hab einfach nicht dran gedacht. Wär dann spätestens bei der Validierung aufgefallen *g*.

          gruss
          tattergreis