gondor: Gleiche Höhe von zwei div-Bereichen erreichen

Hallo!

Ich habe 2 div-Bereiche. Einmal links und einmal rechts.

<div style="float:left; width: 318px;">
 Inhalt (links)
</div>
<div style="float:right; width: 295px;">
 Inhalt (rechts)
</div>

Jetzt möchte ich, dass bei unterschiedlichen Inhalten die Höhe beider divs trotzdem gleich ist.

Wie kann ich das machen?

gondor(..)

  1. hi,

    Jetzt möchte ich, dass bei unterschiedlichen Inhalten die Höhe beider divs trotzdem gleich ist.

    Da CSS so etwas nicht vorsieht [1], nur über Workarounds á la Faux Columns.

    [1] Die tabellen-emulierenden Eigenschaften für display wären eine Möglichkeit, werden aber vom IE nicht unterstützt.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. hi wahsaga!

      wie ist das sonst zu lösen? über tabellen?

      gondor(..)

      1. hi,

        wie ist das sonst zu lösen?

        Nannte ich ein Stichwort, oder nannte ich ein Stichwort?

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }
        1. Nannte ich ein Stichwort, oder nannte ich ein Stichwort?

          :) klar, aber das muss auch über den ie gehen.

          ich versuch das jetzt mit tabellen...

          gondor(..)

          1. Hello out there!

            ich versuch das jetzt mit tabellen...

            Och nö, damit gibtst du die wunderbare Idee des flexiblen Layouts auf.

            Warum sollen die Bereiche dieselbe Höhe haben? Vielleicht lässt sich derselbe gestalterische Effekt auch anders erreichen, evtl. mit Hintergrundbild für body.

            See ya up the road,
            Gunnar

            --
            “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
            1. Warum sollen die Bereiche dieselbe Höhe haben?

              Weil der Hintergrund beider divs eine andere Farbe hat, als der Hintergrund, der die beiden divs umschließt.

              'Rettung in Sicht'?

              gondor(..)

              1. Hi,

                'Rettung in Sicht'?

                hast Du mal an eine Javascript Lösung gedacht? Da es um Kosmetik geht halte ich das für legal, ohne JS sind die Divs halt nicht aneinander angepasst.

                Vorgehensweise: beide Höhen auslesen, die grössere ermitteln, die kleinere entsprechend anpassen.

                Gruesse, Joachim

                --
                Am Ende wird alles gut.
                1. Hi,

                  hast Du mal an eine Javascript Lösung gedacht?

                  aber halt - zu schnell - Du willst nur 2 Spalten erstellen, das lässt sich gut über eine breite Border in der entsprechenden Farbe lösen.

                  Gruesse, Joachim

                  --
                  Am Ende wird alles gut.
                  1. Hi,

                    hast Du mal an eine Javascript Lösung gedacht?
                    aber halt - zu schnell - Du willst nur 2 Spalten erstellen, das lässt sich gut über eine breite Border in der entsprechenden Farbe lösen.

                    Gruesse, Joachim

                    deinen ersten Vorschlag hätte ich umsetzen können, aber nun bei diesen musst du noch ein wenig konkreter werden.

                    gondor(..)

                    1. Hi,

                      deinen ersten Vorschlag hätte ich umsetzen können, aber nun bei diesen musst du noch ein wenig konkreter werden.

                      Ein Div bekommt eine Border in der Breite der linken Spalte. Das linke Div positionierst Du dann darüber oder setzt ein minus-margin, je nach Deiner Seitenkonstruktion. Es entsteht optisch aber der Eindruck zweier gleichhoher Spalten. Ich glaube es gibt Beispiele auf den Layout-Tippseiten hier.

                      Man kann das auch über Hintergrundgrafik lösen, hier sehe ich jedoch den Nachteil der mangelnden Anpassung, wenn der Schriftgrad verstellt wird, da Hintergrundgrafiken (noch) nicht skalierbar sind.

                      Gruesse, Joachim

                      --
                      Am Ende wird alles gut.