Henning: ein clear verschiebt mir mein ganzes hauptelement

hallo zusammen,
nachdem ich mit hilfe der suchfunktion mal einige beiträge hier im forum gestern gelesen hab, bin ich verwirrter als vorher.

auf meiner seite hab ich links ein menü was mit css das attribut float:left hat. in dem inhaltsteil sind bilder, wo text die bilder entweder rechts oder links umfliessen sollte. das funktioniert auch alles ganz gut.
für die bidler hab ich 2 verschiedene css definitionen angelegt:
img#links {
  border: 0;
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
img#rechts {
  border: 0;
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}
die bilder sind in einem absatz mit text und als abschluss hab ich dann <br style='clear:both'> angegeben.
jetzt ist mein problem das opera, mir alles was nach dem ersten bild kommt, einfach unter das menü schiebt.

hier mal ein link: http://www.maverick404.de/index.php?menue=04&action=4

das opera das ganze wahrscheinlich richtig anzeigt ist mir klar, nur was muss ich ändern damit es wie im ie aussieht? bis jetzt hab ich es fast geschafft, das eigentlich fast alles gleich aussieht ohne änderungen. kann mir vielleicht jemand helfen?

mfg henning

  1. hi,

    das opera das ganze wahrscheinlich richtig anzeigt ist mir klar, nur was muss ich ändern damit es wie im ie aussieht?

    Damit das clear nur das float des Bildes aufhebt, und nicht auch das des Menüs, musst du einen containing block schaffen.

    Definiere mal für div#inhalt overflow:hidden, und setze margin auf margin: 0 0 1em 1em;

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. leider kann ich das ganze jetzt nicht ins web laden, da ich gerade arbeite. auf meinem lokalen webserver klappt das allerdings nicht.

      das hatte ich nämlich gestern nach dem ganzen lesen der verschieden links auch schon probiert.

      beim ie wird jetzt auf einmal der komplette div#inhalt zusammengeschrumpft (ca. 0,5 cm).
      bei opera holt er jetzt zwar die anderen bilder und texte nach oben, dafür stimmen jetzt die abstände nach links und recht nicht mehr. links steh ich am menü an und recht fehlt mir genau 1em.

      hab ich vielleicht etwas falsch gemacht? ich hab jetzt nur erstmal die css datei angepasst!

      danke für die schnelle hilfe.

      mfg henning

      1. hi,

        beim ie wird jetzt auf einmal der komplette div#inhalt zusammengeschrumpft (ca. 0,5 cm).
        bei opera holt er jetzt zwar die anderen bilder und texte nach oben, dafür stimmen jetzt die abstände nach links und recht nicht mehr. links steh ich am menü an und recht fehlt mir genau 1em.

        Ich habe das ganze nur kurz im Firefox über "Edit CSS" in der Web Developer Toolbar probiert - da ging's.

        overflow:hidden ist aber auch nur eine Möglichkeit, einen containing block zu erzeugen.
        #inhalt ebenfalls floaten zu lassen, wäre eine weitere.

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. das verursacht jetzt 2 recht interessante sachen.

          ie: geht der ganze inhalt auf die recht seite und lässt in der mitte einen freiraum.

          opera: nimmt den ganzen inhalt und packt diesen neben das menü aber es fängt erst am unteren ende vom menü an!

          gibt es eine möglichkeit einen containing block zu erzeugen der keine auswirkungen hat?

          mfg henning