Andreas: FF zeigt meine Seite ganz anderst als IE

Hi,
dass FF und IE nicht der gleichen Meinung sind ist bekannt.
Ich möchte nichts anderes als Bilder und Text wechselweise nebeneinander stehen haben, und diesmal wollte ich dafür keine Tabelle nehmen.
Also
Bild Text
Text Bild
Bild Text
etc.

Hier meine Seite an der ich am basteln bin. Im IE sieht alles ganz gut aus aber im FF eben nicht:
http://www.access-o-mania.de/pension/index.php?action=haus
Den Text bring ich mit <br> in die gewünschte Höhe, die Bilder mit margin-top.

Auf dieser Seite wo ich den Text noch nicht in divs eingefasst habe um Blocksatz zu erhalten sieht es "normal" aus:
http://www.access-o-mania.de/pension/index.php?action=start&op=haus

Kann mir jemand ein Tipp geben wie ich so eine Struktur auch im FF erhalte?

Gruß Andreas

  1. Hallo Andreas!

    Würdest Du Dene Seite mit Elementen die semantisch richtig sind aufbauen, würde der IE die Seite auch nicht fälschlicherweise richtig darstellen. Der Firefox macht es nämlich richtig. Es sieht nur für Dich falsch aus.

    Schönen Gruß

    Afra

    1. Hi,
      würdest du mir noch sagen welche Elemente nicht semantisch richtig sind?

      Gruß Andreas

      1. Hallo!

        Du benutzt eine Tabelle für Layoutzwecke.
        Du benutzt unnötigerweise Dvivisions obwohl p Tags ausreichend wären.
        Du verwendest eine üble Mischung aus CSS und veralteten html Auszeichnungen: ("aling="center")
        Du hälst Dich nicht an die XHTML Anforderungen die Du mit Deinem Doctype forderst.

        Das sind nur ein paar Anmerkungen.

        Dein Dokument ist nicht valide.

        http://validator.w3.org/check?uri=http%3A%2F%2Fwww.access-o-mania.de%2Fpension%2Findex.php%3Faction%3Dhaus

        Schönen Gruß

        Afra

        1. Hallo
          OK, nächster Versuch.
          Dokument ist nun Valide, deine Divs mehr, keine <br> mehr. Wie komm ich jetzt zu meinem beschriebenem Layout?

          Zur Erinnerung, ich möchte
          Text | Bild
          Bild | Text
          Text | Bild
          etc.

          Außerdem wäre es auch ganz schön wenn die Höhe des Textes kleiner als die Höhe des Bildes ist dass dann das darunterliegende Bild sich hochschiebt. So wie es im IE sich zeigt.

          Mein eingesetzter gekürzter Code sieht so aus:
          $output = "
          <p><img align="right" src="img1.jpg" alt="" title="" /></p>
          <p align="justify" style="width: 280px">Hier kommt Text 1</p>
          <p><img align="left" src="img2.jpg" alt="" title="" /></p>
          <p align="justify" style="width: 280px>Hier kommt Text 2</p>";

          Gruß Andreas

          1. Hallo,

            OK, nächster Versuch.
            Dokument ist nun Valide, deine Divs mehr, keine <br> mehr.

            Jetzt sollten noch die unnötigen Tabellen verschwinden...

            Mein eingesetzter gekürzter Code sieht so aus:
            $output = "
            <p><img align="right" src="img1.jpg" alt="" title="" /></p>
            <p align="justify" style="width: 280px">Hier kommt Text 1</p>
            <p><img align="left" src="img2.jpg" alt="" title="" /></p>
            <p align="justify" style="width: 280px>Hier kommt Text 2</p>";

            Du hast immer noch nicht konsequent auf CSS umgestellt (z. B. align="..."). Schau dir dazu am besten die entsprechenden Kapitel bei SelfHTML an. Besonders der Befehl 'float' dürfte für dich nicht uninteressant sein.

            Gruß
            Josh

            1. Hi
              OK, Layout soweit fast OK, der zweite Textblock passt in der Höhe nicht.
              Die Style-Angabe ist margin-top: 80px.
              Beim IE ist der Text teilweise verdeckt, beim FF bildet sich schon eine Lücke. Der Grund wird wohl sein dass beide Browser den Bezugspunkt von dem die 80px gehen sollen anderst legen?!

              Ich bekomm echt noch ein Vogel mit dem Sch....
              Ich werde es wohl doch wieder als Tabelle machen, das ist wenigstens Browserunabhängig und funktioniert garantiert. Und mir ist jetzt grad egal wen ich damit aussperre.

              Andreas

          2. Hallo Andreas!

            Du solltest den Text um die Bilder fließen lassen. Josh hat Dir dazu schon einen guten Ansatz gegeben.

            Setze Dich mit den Möglichkeiten von CSS auseinander. Wir werden Dir hier gerne helfen. Aber ein neues layout für Deine Seite musst Du schon selbst erstellen. Du schaffst das aber, da Du anscheinend gewillt bist auf Hinweise einzugehen.

            Schönen Gruß

            Afra