vertical-align - wieso geht's nicht?

[kölir]

Hallo,

ich habe folgenden Code, aber der Text innerhalb des div, will einfach nicht unten ausgerichtet werden.

<div id="footer">
TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT
</div>

div#footer {
 min-height:194px;
 vertical-align:text-bottom;
 }

Warum geht mein Vorhaben nicht?

Gruß

[Downlord]

Hallo,

ich habe folgenden Code, aber der Text innerhalb des div, will einfach nicht unten ausgerichtet werden.

<div id="footer">
TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT
</div>

div#footer {
min-height:194px;
vertical-align:text-bottom;
}

Warum geht mein Vorhaben nicht?

Um es mal mit den hier typischen Worten zu sagen:
Dein Vorhaben, Text an einem anderen Element auszurichten klappt.

Aber du wolltest wahrscheinlich den Text am unteren Rand des Divs positionieren. Dies klappt mit deinem Beispiel nur in Tabellenzellen.

Die schnelle Lösung ist den Text in einen weiteren Element zu stecken, und diesem per "bottom" unten "ausrichten":

<style>
div#footer {
 position:relative;
 border: 1px solid #000000;
 min-height:194px;
 vertical-align:bottom;
 }
div#texttexttext {
 position: absolute; bottom: 0;
}
</style>

<div id="footer">
<div id="texttexttext">
TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT
</div></div>

Feierabendgrüße,
DL

[kölir]

Danke

Und was wäre die "langsame" Lösung?

[kölir]

Oder was sind die Nachteile an der "schnellen" Lösung?

[Downlord]

Oder was sind die Nachteile an der "schnellen" Lösung?

Ich weiß jetzt nicht, warum du das Wort "schnell" negativ wertest. Ich denke nicht, dass dir diese Lösung Nachteile erbringt.

Gruß,
DL

[Gunnar Bittersmann]

Hello out there!

Was hat deine Archivsuche nach "vertical-align" ergeben?

div#footer {
min-height:194px;
vertical-align:text-bottom;
}

Warum geht mein Vorhaben nicht?

Wegen „'vertical-align' angewendet auf: Elemente auf Inline-Ebene und 'table-cell'-Elemente“ [CSS2 §10.8]

See ya up the road,
Gunnar