cangoou: Unterschiedliches Layout in IE und anderen Browsern

Hallo! Haben folgenden (einfachen?!) HTML-Code. Das Problem: In jedem Browser sieht das anders aus.

Opera: Stellt div3 richtig da (in der Tabelle) und schneidet div3 an den Kanten der Tabelle ab.

Firefox: Stellt div3 richtig da (in der Tabelle), schneidet div3 an den Kanten der Tabelle aber nicht ab.

IE: div3 wird komplett RECHTS neben der Tabelle dargestellt, d.h. hier müßte ein in div3 für left: einen negativen Wert angeben, damit div3 wieder in der Tabelle liegt.

... wobei ich mit "richtig" meine, so, wie ich mir das denke ;-) Muß ich nun für jeden Browser einen anderen Code schreiben? Leider benötige ich diese Struktur.

Viele Grüße

Martin

<HTML>
<BODY>

<div id="div1" style="position:absolute;top:0px;left:0px;height:800px;width:800px;visibility:visible;overflow:hidden;border:1px solid black">
<div id="div2" style="position:relative;left:0px;top:0px;border:0px;overflow-y:hidden;overflow-x:hidden;border:1px solid blue">

<TABLE ALIGN=LEFT BORDER="4" CELLPADDING="0" CELLSPACING="0">
<TR><TD>Text davor</TD><TR>
<TR><TD ALIGN="LEFT" VALIGN="TOP">
<DIV ID="div3" style="position:relative;left:0px;top:20px;width:200px;height:100px;background:#FF0000;visibility:visible">
Text
</div>
</TD></TR>
<TR><TD>Text dahinter</TD><TR>
</TABLE>
</div></div>
</BODY>
</HTML>

  1. hi,

    Hallo! Haben folgenden (einfachen?!) HTML-Code. Das Problem: In jedem Browser sieht das anders aus.

    Opera: [...]
    Firefox: [...]
    IE: [...]
    ... wobei ich mit "richtig" meine, so, wie ich mir das denke ;-)

    schön, und was _willst_ du jetzt eigentlich erreichen?

    Muß ich nun für jeden Browser einen anderen Code schreiben?

    nein, aber erst mal halbwegs _richtigen_.
    derzeit hast du nicht mal einen doctype angegeben - du lädst also jeden browser zu einer fröhlichen raterunde ein, "hey, lass doch mal sehen, wie du folgendes darstellen würdest ...?"

    Leider benötige ich diese Struktur.

    das halte ich für _äußerst_ fraglich.
    nachvollziehbare begründung für dieses "brauchen" wäre schön ...

    gruß,
    wahsaga

    --
    "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
    1. Hi wahsaga, danke für Deine Antwort!

      schön, und was _willst_ du jetzt eigentlich erreichen?

      Okay: Ich möchte einen Textbereich vertikal über 2 Knöpfe scrollen. Dafür die 2 äußeren DIVs (div1 clippt und verschiebt den Scroll-Bereich, div2 ist eigentlich nur dazu da, die Höhe zu bestimmen, damit ich weiß, wieviel gescrollt werden kann). div3 ist dann dazu da, einen Text horizontal zeitabhängig zu scrollen (Ticker).

      Bitte das nicht in Frage stellen, ich weiß, ist ein Haufen Gimmick-Zeug, soll aber so sein ;-)

      Muß ich nun für jeden Browser einen anderen Code schreiben?

      nein, aber erst mal halbwegs _richtigen_.
      derzeit hast du nicht mal einen doctype angegeben - du lädst also jeden browser zu einer fröhlichen raterunde ein, "hey, lass doch mal sehen, wie du folgendes darstellen würdest ...?"

      Sorry, wollte das Ganze auf eine möglichst einfache Ebene runterbrechen, um festzustellen, wo es hakt.

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

      Grüße

      Martin

      1. hi,

        Ich möchte einen Textbereich vertikal über 2 Knöpfe scrollen. Dafür die 2 äußeren DIVs (div1 clippt und verschiebt den Scroll-Bereich, div2 ist eigentlich nur dazu da, die Höhe zu bestimmen, damit ich weiß, wieviel gescrollt werden kann).

        dass overflow-x/-y bei div2 aber nur vom IE interpretiert wird (bzw. ggf. auch noch vom opera, wenn er diesen mal wieder nachäfft), ist dir bewusst?

        gibt's das ganze evtl. mal als online-beispiel?

        gruß,
        wahsaga

        --
        "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
        1. Ich möchte einen Textbereich vertikal über 2 Knöpfe scrollen. Dafür die 2 äußeren DIVs (div1 clippt und verschiebt den Scroll-Bereich, div2 ist eigentlich nur dazu da, die Höhe zu bestimmen, damit ich weiß, wieviel gescrollt werden kann).

          dass overflow-x/-y bei div2 aber nur vom IE interpretiert wird (bzw. ggf. auch noch vom opera, wenn er diesen mal wieder nachäfft), ist dir bewusst?

          Ups, soweit war ich noch gar nicht. D.h. vermutlich, es wird mit dem scrollen eh auf den anderen Browsern nicht klappen, weil sie munter den "weggescrollten" Text weiter darstellen anstatt ihn zu clippen. Oder gibts da andere Möglichkeiten?

          Gibt's trotzdem ne Idee, wieso die Position vom IE in diesem Fall so verhuntzt wird? Wenn ich div1 oder div2 wegnehme, oder die Tabelle weglasse, gehts ja. Also vermutlich ein "Feature"....

          gibt's das ganze evtl. mal als online-beispiel?

          Leider (noch) nicht, bisher muß der angehängt Quellcode reichen.

          Grüße

          Martin

          1. hi,

            dass overflow-x/-y bei div2 aber nur vom IE interpretiert wird (bzw. ggf. auch noch vom opera, wenn er diesen mal wieder nachäfft), ist dir bewusst?
            Ups, soweit war ich noch gar nicht. D.h. vermutlich, es wird mit dem scrollen eh auf den anderen Browsern nicht klappen, weil sie munter den "weggescrollten" Text weiter darstellen anstatt ihn zu clippen. Oder gibts da andere Möglichkeiten?

            tja, man könnte es ja gleich richtig machen, mit overflow. wieso du überhaupt die -x/-y-variante nutzt, wenn doch beide den selben wert bekommen, ist eh schleierhaft.

            gibt's das ganze evtl. mal als online-beispiel?
            Leider (noch) nicht, bisher muß der angehängt Quellcode reichen.

            tut er aber nicht, zumindest nach meinem dafürhalten.

            gruß,
            wahsaga

            --
            "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
            1. tja, man könnte es ja gleich richtig machen, mit overflow.

              Ups, das waren vorangegangene Tests. Na, wenns mit overflow an sich gehtm, bin ich ja beruhigt. Danke für den Tipp.

              Leider (noch) nicht, bisher muß der angehängt Quellcode reichen.

              tut er aber nicht, zumindest nach meinem dafürhalten.

              Bin für alle Ideen offen... Vor allem, warum eben IE meinen div3 so weit nach rechts setzt.

      2. Okay: Ich möchte einen Textbereich vertikal über 2 Knöpfe scrollen. ... div3 ist dann dazu da, einen Text horizontal zeitabhängig zu scrollen (Ticker).

        Bitte das nicht in Frage stellen, ich weiß, ist ein Haufen Gimmick-Zeug,

        Nein, nicht Gimmick, sondern Unsinn.

        soll aber so sein ;-)

        Warum? Erstellst du eine Seite, auf der du anhand von Negativbeispielen die Unsinnigkeit erläuterst?

        Gunnar

        --
        „Solang wir noch tanzen können
        und richtig echte Tränen flennen,
        ist noch alles offen,
        ist noch alles drin.“
        (Gundermann)
  2. cangoou,
    Was denkst du, was das von dir als Themenbereich gewählte „DHTML“ bedeutet?
    DIV-Suppen-HTML?

    Gunnar

    --
    „Solang wir noch tanzen können
    und richtig echte Tränen flennen,
    ist noch alles offen,
    ist noch alles drin.“
    (Gundermann)