Mehrere Div's nebeneinander

[Jens Schärer]

Hallo,

ich benötige auf einer neuen Seite eine Art Tabelle... Dies soll jedoch nicht als Tabelle realisiert werden, sondern mit Div- bzw. Block- und Inlineelementen.

Dabei benötige ich drei "Spalten":

SPALTE1  SPALTE2  SPALTE3

die mittlere Spalte soll dabei sich dynamisch an die größe des Bildschirms anpassen, alle drei Spalten zusammen ergeben 100%. Die Mittlere Spalte soll also die beiden anderen auseinanderdrücken, wie das bei Tabellen auch funktioniert.
Wie realisiere ich so etwas mittels standardkonformer Mittel?

[zuzuu]

Ganz einfach: Das Stichwort ist "float". Den Rest kannst du mit CSS bewerkstelligen (width etc, aber das weißt du ja hoffentlich).

[chlori]

Hallo

SPALTE1  SPALTE2  SPALTE3

die mittlere Spalte soll dabei sich dynamisch an die größe
des Bildschirms anpassen, alle drei Spalten zusammen ergeben 100%.

Linke und rechte Spalte links bzw. rechts floaten und
bei der mittleren Spalte links und rechts die Breite der
äusseren Spalten jeweils als margin angeben.

Gruss
chlori

[Zeromancer]

Hallo,

Linke und rechte Spalte links bzw. rechts floaten und
bei der mittleren Spalte links und rechts die Breite der
äusseren Spalten jeweils als margin angeben.

nebenbei habe ich gelesen, dass man die Reihenfolge im Quelltext folgendermaßen vornehmen sollte:

div#left

div#right

div#content

so dass erst die linke und rechte Seite aufgebaut werden und der Rest vom Content-Div gefüllt wird.

Mit freundlichen Grüßen

André

[Ashura]

Hallo Zeromancer.

so dass erst die linke und rechte Seite aufgebaut werden und der Rest vom Content-Div gefüllt wird.

Ob das so eine gute Idee ist? Sie dir das mal im Lynx an... Da musst du erst ewig an der Navigation und anderen Links vorbeiscrollen, bevor überhaupt erst einmal Inhalte kommen.

Gruß, Ashura

[chlori]

Hallo

Ob das so eine gute Idee ist? Sie dir das mal im Lynx an...
Da musst du erst ewig an der Navigation und anderen Links
vorbeiscrollen, bevor überhaupt erst einmal Inhalte kommen.

Mit absoluter Positionierung kann die Reihenfolge mehr oder
weniger beliebig bestimmt werden. Wer absoulte Positionierung
nutzen will soll aber auch die Gefahren kennen.

Gruss
chlori

[Ashura]

Hallo chlori.

Wer absoulte Positionierung nutzen will soll aber auch die Gefahren kennen.

Und diese kommen eben dann zum Vorschein, wenn das Stylesheet aus welchem Grund auch immer nicht zur Verfügung steht.

Es ist einfach entgegenkommend, auch für Screenreader, den Inhalt an die erste Stelle zu rücken.

Gruß, Ashura

[wahsaga]

hi,

Es ist einfach entgegenkommend, auch für Screenreader, den Inhalt an die erste Stelle zu rücken.

... und deshalb auf belange des designs gar keine rücksicht mehr zu nehmen?

dann doch lieber anker-links zum überspringen von navi etc. anbieten, die in der normalen darstellung versteckt werden.

gruß,
wahsaga

[Ashura]

Hallo wahsaga.

... und deshalb auf belange des designs gar keine rücksicht mehr zu nehmen?

Was hat das damit zu tun?

Beispiel:

[Source]
div1
div2
div3

[Ausgabe]
div3
div1
div2

Das eine hat doch mit dem anderen nichts zu tun. Ich meinte nur, dass eine entgegenkommende Struktur auch dann gegeben sein sollte, wenn das CSS nicht zur Verfügung steht.

Gruß, Ashura

[wahsaga]

hi,

Beispiel:

[Source]
div1
div2
div3

[Ausgabe]
div3
div1
div2

und das machst du _wie_, wenn der erste div der inhalts-div, und in einem 3-spaltenlayout zwischen 2 links und 3 rechts stehen soll?
und ja, ich meine ohne absolute positionierung, denn deren nachteile bei schriftvergrößerung kennst. auch sollen bitte beispielsweise die elemente dann untereinander dargestellt werden, wenn zu wenig breite verfügbar ist.

Das eine hat doch mit dem anderen nichts zu tun. Ich meinte nur, dass eine entgegenkommende Struktur auch dann gegeben sein sollte, wenn das CSS nicht zur Verfügung steht.

ein link zum überspringen vorgelagerter teile, der direkt zum inhalt führt und ohne CSS sichtbar ist, ist m.E. entgegenkommend.

(mehr auf jeden fall, also jetzt obiges beispiel auf teufel komm raus mit absoluter positionierung umzusetzen, undgeachtet ihrer nachteile.)

gruß,
wahsaga

[Ashura]

Hallo wahsaga.

ein link zum überspringen vorgelagerter teile, der direkt zum inhalt führt und ohne CSS sichtbar ist, ist m.E. entgegenkommend.

Damit könnte ich mich anfreunden.

Gruß, Ashura

[Jens Schärer]

nebenbei habe ich gelesen, dass man die Reihenfolge im Quelltext folgendermaßen vornehmen sollte:

div#left

div#right

div#content

Danke, hat wunderbar funktioniert :)

Gruß,
 Jens