nicht angemeldet
2 Divs nebeneinander positionieren
0 
Gernot Back
0
2 Divs nebeneinander positionieren
Hallo,
ich möchte zwei DIV-Elemente horizontal, nebeneinander positionieren. Dabei sollen sich beide Elemente beim Verkleinern des Browserfenster wie eine Tabelle verhalten.
Wie ein Element ein anderes umfließt, habe ich schon mit der float-Eigenschaft ausprobiert. Der Inhalt des einen DIVs umfließt den Inhalt des anderen. Das ist schlecht bzw. nicht das, was ich erreichen möchte.
Wie kann ich ein Tabellenverhalten simulieren?
Hier zum Verdeutlichen was ich erreichen möchte, ein Beispiel:
Ausgangsposition (Bildschirmgesamtbreite):
----------- ------
| div1 | |div2|
----------- ------
Browserfenster verleinert:
------- ----
| di ||di|
| v1 ||v2|
------- ----
Jetziges Verhalten (mit Float):
Ausgangsposition (Bildschirmgesamtbreite):
----------- ------
| div1 | |div2|
----------- ------
Browserfenster verleinert:
------- ----
| di ||di|
| v1 ||v2|
| ----
| mehr |
| Inhalt |
------------
Danke für Eure Antworten
-
Hallo Bianca,
ein DIV-Element möchtest du floaten lassen und dem anderen einen Margin in der Breite des einen geben.
Gruß Gernot
-
Hallo Bianca,
ein DIV-Element möchtest du floaten lassen und dem anderen einen Margin in der Breite des einen geben.
Gruß Gernot
Hallo Gernot,
danke es hat geklappt :-) Bist mein Retter in der Not. :-))
-
-
Hi,
ich möchte zwei DIV-Elemente horizontal, nebeneinander positionieren. Dabei sollen sich beide Elemente beim Verkleinern des Browserfenster wie eine Tabelle verhalten.
Warum möchtest du das? Was spricht gegen ein Umfließen der Navigation?
Ansonsten kannst du den Inhalts-block auch einen Margin geben, der muss dann etwas größer als die Navi sein.
Eine andere Möglichkeit, die auf diese Weise gut realisierbar ist, ist Übrigens eine Art Frameset. Also 2 unabhängige Scrollbereicht, die jeweils 100% hoch sind. Dazu musst du body und html natürlich auch mit hieght:100% und margin:0 bzw. padding:0 formatieren.
Das klassische Tabellenlayout dagegen, lässt sich nur über einen Trick mit Hilfe eines Hintergrundbildes erzielen.
Mehr dazu in der Selfhtml-Doku im Bereich CSS-basierte Layouts/mehrspaltige CSS Layouts.
Einen schönen Samstag noch!