Antworten auf deine Fragen:
Neues Thema erstellen

Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Dissolution

Freund und Helfer

Hallo zusammen liebe Community!

Schon immer habe ich mich gegen Tabellen für Layouts gewährt, habe mich bemüht auf .css und DIVs zu setzen, doch für ein neues Projekt treibt mich ein allzu bekannter Fehler in den Wahnsinn.

Für ein vBulletin 4 habe ich ein grafisches Layout erstellt und es sah ganz gut aus. Allerdings wirkt es auf verschiedenen Auflösungen anders und nunja, das Layout soll, so der Wunsch, überarbeitet werden. Die Hintergrundgrafik die den Inhalt umspannt soll in 3 verwandelt werden... .

Schnell war die Idee da ein 3 spaltiges Layout zu entwerfen und die Hintergrundgrafik aufzuteilen.

Also 3 Divs zu 20%,60% und wieder 20%.

Die beiden Äußeren sollten nur die Grafiken enthalten, die mittlere den eigentlichen Content. Damit wäre das ganze Layout "halbfluid" gewesen, viel flexibler was verschiedene Bildschirme angeht und doch immer sehr gut lesbar. (Ansonsten eben noch mit min/max-width - Werten)

Aber wie wir ja alle wissen und woran ich schmerzvoll erinnert wurde... Divs wachsen vertikal nicht miteinander. Eine fixierte Höhe ist aber durch den seeehr variablen Inhalt nicht möglich.

Stunde um Stunde habe ich gesucht, doch auch nach all den Jahren scheint dieses "Problem" nicht als solches erkannt oder schlichtweg nicht lösbar/gelöst zu sein.

Faux-Columns ist eben nicht Sinn der Sache... 1 Background-datei wurde versucht.

Gibt es irgendwelche Insider-Workarounds, oder muss ich wirklich auf Tabellen zurückgreifen? Ich habe Tabellen nämlich seit Jahren nicht benutzt und da das Ganze ein Hobby ist, habe ich sie verlernt :( Aber gut, das wäre sicherlich wieder erlernbar. Ich will aber erst dann darauf zurückgreifen wenn ich alles andere probiert habe.

Liebe Grüße,
Dissolution
 
Zuletzt bearbeitet:

sokie

Mod | Web

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

ein link zum beschriebenen Projekt würde die Sache doch sehr vereinfachen.
 

Dissolution

Freund und Helfer

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

ein link zum beschriebenen Projekt würde die Sache doch sehr vereinfachen.

Durchaus ja! Da das Projekt sich allerdings noch nicht online befindet gestaltet sich das als schwierig. Noch dazu wo vBulletin 4.0 erst im RC-Stadium angelangt ist.

Ich habe das Problem so gut es ging erklärt, aber wenn etwas nicht verständlich ist so bitte ich um Rückmeldung.

Es geht schlichtweg darum 3 DIVs nebeneinander zu haben wobei alle die selbe Höhe haben sollen, die durch variablen Inhalt im mittleren DIV definiert sei.

Leider war meine stundenlange Suche nicht erfolgreich (bin übrigens immer noch dabei)
 

reinholdi

Aktives Mitglied

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

eine genauere Beschreibung wäre von Vorteil, dann bekommst du auch geholfen!
 

wex_stallion

Motzerator

Teammitglied
PSD Beta Team
AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Und ist natürlich alles ganz dolle geheim und so …

Was mich aber dennoch interessieren würde: Warum soll die Höhe sich aus dem Content des mittleren DIV-Container ergeben?

Was, wenn im mittleren vier Zeilen sind, im linken aber nur eine. Dann würde doch links was fehlen.
 

Dissolution

Freund und Helfer

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Und ist natürlich alles ganz dolle geheim und so …

Hmm, Sarkasmus im Internet wirkt nicht halb so toll wie von Angesicht zu Angesicht. Fakt ist, dass ich keinen Zugang geben kann, da kein Webspace und damit keine Möglichkeit das Ganze Online zu stellen gegeben ist.

Was mich aber dennoch interessieren würde: Warum soll die Höhe sich aus dem Content des mittleren DIV-Container ergeben?

Was, wenn im mittleren vier Zeilen sind, im linken aber nur eine. Dann würde doch links was fehlen.


Und genau das soll nicht sein! Ich frage ja nach einem Workaround.
Tabellen "wachsen" vertikal mit, DIVs tun das nicht.

Ziel ist es, dass 3 DIVs nebeneinander die selbe Höhe haben, unabhängig vom jeweiligen Inhalt.

In der Mitte ist der variable Content (News, Forenbeiträge etc. pp) und links und rechts davon sind jeweils Grafiken (Hintergründe) die sich vertikale solange wiederholen sollen bis der variable Inhalt ein Ende erreicht hat.

eine genauere Beschreibung wäre von Vorteil, dann bekommst du auch geholfen!

Dazu müsste ich wissen wo es harkt... ich habe es jetzt mehrfach erklärt und ich kenne keine anderen Worte dafür.
Wieso greift man auf Faux-Colums zurück? Weil man möchte, dass die einzelnen DIVs die selbe Höhe haben.
 
Zuletzt bearbeitet:

Chrisnew

Noch nicht viel geschrieben

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Dies sollte sich doch ganz einfach mit einem leeren .gif lösen lassen, so wie bei den Tabellen gewohnt, kann ja auch ein div Container an bzw. mit einem unsichtbaren Gif ausgerichtet werden, wenn Du das Ganze noch mit php verknüpfst kannst du ja das gif bzw. deren Werte entsprechend dem Inhalt ändern.
 

wex_stallion

Motzerator

Teammitglied
PSD Beta Team
AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Du kannst eine feste Höhe benennen. Das können z.B. 600 Pixel sein oder 80% Viewport.

Dann hast du (einfach gesagt) drei nebeneinanderseiende Rechteecke gleicher Höhe.

DIV-Container funktionieren dummerweise (manche finden es auch gut) eben anders als Tabellen. Das kann man toll finden oder auch grottenscheiße … ändern kann man es kaum.

Ich würde eher zu einer relativen Viewportangabe tendieren. Das Hintergrundmuster in den Boxen kannst du ja entsprechend anlegen.

Aber es ist sinnfrei irgendeinem DIV die Höhenhoheit geben zu wollen, denn irgendwann macht immer "das falsche" zuviel Raum. Und sei es nur im billigen Internetcafé auf 800 x 600 Pixel-Monitoren.
 

Dissolution

Freund und Helfer

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Du kannst eine feste Höhe benennen. Das können z.B. 600 Pixel sein oder 80% Viewport.

Wie bereits erwähnt geht das nicht, da der Content einmal 1000px hoch sein kann, dann wieder 10000px... .

DIV-Container funktionieren dummerweise (manche finden es auch gut) eben anders als Tabellen. Das kann man toll finden oder auch grottenscheiße ? ändern kann man es kaum.

In meiner Einleitung erwähnte ich, dass ich seit jeher auf DIVs und .css setze, mich nie mit Tabellen beschäftigt habe - nicht umgekehrt.

Demnach gibt es keine Lösung für das Faux-Columns "Problem", auch nach 4 Jahren nicht.

Schade, dann werde ich für diesen Teil des Design, zu meinem tiefsten Bedauern, auf Tabellen zurückgreifen müssen.
 

wex_stallion

Motzerator

Teammitglied
PSD Beta Team
AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Wie bereits erwähnt geht das nicht, da der Content einmal 1000px hoch sein kann, dann wieder 10000px... .

Achso, der ganze Scheiß soll sich noch automatisch passend browserzoomen? 10.000 Pixel Höhe dürften selbst mit einem 30"-Bildschirm schwierig werden. Vielleicht suchst du dir mal ein stillgelegtes Autokino oder sowas in der Art ?

Auch mit Tabellen hättest du dann die "Content"-Tabelle halt gleich hoch, aber z.B. die Navigation wäre dann drei durchzuscheuernde Mouse-Pads entfernt.
 
Zuletzt bearbeitet:

Chrisnew

Noch nicht viel geschrieben

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Ich vermute mal, schlicht und einfach, deine dritte Spalte ist leer, deshalb wird sie auch ignoriert, einfach einen Platzhalter ( ) platzieren und dann sollte auch die dritte Spalte zu sehen sein???
 

Chickenshooter

Alter Mann

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

Moin

ein Workaround wäre vieleicht das hier:

-begrenze den mittleren DIV auf eine feste Breite.
-mit PHP begrenzt Du den Text, so das er immer in diese Breite passt
-dann wäre es möglich die Zeilen die sicherlich aus einem SQL-Statement kommen zu zählen und mal die Zeilenhöhe der Buchstaben zu nehmen die das ganze dann darstellen sollen. ( sprich eine Zeile hat 15px mal 20 Zeilen aus der DB) = 300px Höhe plus vielleicht noch ein bisschen Sicherheit von 20px
-dann die errechnete Höhe zur Laufzeit mit InlineTags den 3 Divs zuweisen.

hoffe ich konnte helfen!!!

MfG
 
C

CrayTac

Guest

AW: Faux-Colums? Nein! Andere Lösungsmöglichkeiten?

AUch ich bin in meiner jetzigen Arbeit über das Problem mit den in der Höhe mitwachsenden Spalten gestolpert. Bei mir gestaltete sich das ganz ähnlich.

Ich habe ein 2 Spalten Layout:
Links - Menu mit einer farbigen Hintergrundgrafik (zur Farbtreue)
Rechts - Inhalt mit variabler Länge

Zuerst habe ich mich ja über die Möglichkeit die "Faux-Columns" bietet gefreut da die LinkeSpalte so groß wurde wie der Inhalt der rechte Spalte. Leider musste ich dann feststellen das sich das nur auf den Viewport bezog. Wurde der Inhalt der rechten Spalte so groß das ein Scrollbalken von nöten wurde wuchs die linke Spalte leider nicht mit.

Aus diesem Grund habe ich diesen Beitrag hier mit Interesse verfolgt und hoffte auf ein paar Ideen die das ganze Problem bewätigen können. Nebenbei habe ich aber auch selber noch das Internet bemüht und mich durch x Foren geklickt bis ich auf folgende Seite gestossen bei der dieses Problem anscheinend kein Problem ist.

Die Lösung heißt hier "Equal Height Columns".
Ich habe das natürlich sofort ausprobiert und siehe da es funktioniert.
Es funktioniert sogar sogut das die linke Spalte auch bei dynamischer Veränderung des Inhaltes in der rechten Spalte mitwächst.

Erstmal der Link für alle Ungeduldigen:
Equal Height Columns

Was mich bei diesem Code ein wenig verwirrt sind die ganzen Browser-Fixes.
Ich bin ja recht fit in CSS nur leider ist mein englisch einigermaßen mies, vllt. findet sich ja wer der mir die ganzen Fixes auf deutsch erklären kann.
Grund und Wirkung wäre nett.

Hoffe das konnte helfen.
GL + HF
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.635
Beiträge
1.538.481
Mitglieder
67.559
Neuestes Mitglied
hanuta
Oben