chris340: Textbox vertikal an benachbarten Elementen ausrichten

Beitrag lesen

Hallo Gunther, vielen heißen Dank!

Sieht aber nach einer größeren "Baustelle" aus ... ;-)

WOW - da hab ich wohl wirklich ins Wespennest gestochen...

Dann gleich mal ein paar Fragen hintendran:

Du solltest dir erstmal das Kapitel Der normale Elementfluss angucken. Und das Wörtchen "Fluss" verdeutlicht hier schon, dass CSS quasi nur in eine Richtung (halt mit dem Strom/ Fluss), nämlich abwärts "funktioniert".

Genau. Eine Vermutung in die Richtung hatte ich ja schon formuliert.

Mit JavaScript würde ich das schon irgendwie hinkriegen, frage mich nur, ob das auch ohne geht...
Es geht. Die Frage ist aber, ob es Sinn macht.

Soll was genau heißen? Es ist fraglich, ob das Layout Sinn ergibt oder das Weglassen von JavaScript???

Ich habe deinen Code mal stehen lassen, weil er imho zeigt, dass da noch ein gewisser "Nachholbedarf" besteht.

Das mag durchaus sein. Ich mach das hobbymäßig, denke daran gemessen ist's sicher weit besser als der Durchschnitt. ;-)

Das fängt z.B. damit an, dass du inline-styles verwendest. Auch die Vergabe von IDs und Klassen, sowie deren Benennung scheint mir verbesserungsfähig.

Hättest Du Lust, Dir die Mühe zu machen und mir ein Gegenbeispiel aufzuschreiben? Dann könnte ich mir mehr darunter vorstellen.

Außenabstände erreicht man üblicherweise durch Margins (und nicht relative Positionierung).

Stimmt. Werde ich ändern.

Ich fasse deine Ausgangssituation nochmal zusammen:

[...]

Soweit richtig?

Soweit richtig!

Erste Frage, die sich aufdrängt ist: Was ist, wenn die Höhe der 3 "Boxen" höher ist, als die des umschließenden Containers?

Naja, das wird in meinem Fall kaum passieren, es sei denn jemand benutzt ein Fenster mit weniger als ca. 500 Pixeln Höhe. Und für den Fall könnte man noch ein "overflow:auto;" in der flexiblen (oder einer anderen) Box installieren.

Aber davon jetzt mal abgesehen ..., sind mir 2 Möglichkeiten bekannt, das mit CSS zu realisieren.

Möglichkeit 1:
Verwende die Display Table Eigenschaften

Für was genau gibt es display:table? Bzw. was ist der Unterschied zu einer normalen Tabelle? Doch wohl nicht nur, dass man das Konstrukt dann formal nicht Tabelle(-nlayout) nennen muss... ;-)
Das das Problem mit nem Tabllen-"layout" leicht zu meistern wäre, ist mir schon klar.

Möglichkeit 2:
Verwende das Flexbox Modul
Demo: http://flexiejs.com/playground/

Interessant! Ist mir völlig neu. Warum finde ich dazu nichts auf Selfhtml?

Wenn, dann würde ich dir in diesem Fall zu Möglichkeit 1 raten.

Ok... Gibt's ne Begründung für diese Tendenz?

So oder so hast du aber sicher erstmal eine Menge "Lese-/ Lernstoff" vor dir, um die jeweiligen CSS Eigenschaften und ihre Wirkungsweise zu verstehen. Letzteres ist elementar ...!

Allerdings.
Herzlichen Dank nochmal! Damit werde ich sicher irgendwie weiter kommen. (Würde mich natürlich trotzdem freuen, wenn Du mir meine nachhakenden Fragen noch beantworten könntest! ;-) )

Chris