[CSS:] Inhalt in statisch positioniertem Container ausrichten

maceis

maceis

Aktives Mitglied
Thread Starter
Dabei seit
24.09.2003
Beiträge
16.880
Reaktionspunkte
626
hallo zusammen,

ich suche nach einer Möglichkeit, den Inhalt eines statisch positionierten div Containers am unteren Rand auszurichten.
Geht das überhaupt?

Konkret geht es um eine Tabelle in einem Footer, die als Ganzes am unteren Rand des Footers erscheinen sollte.
"#footer {vertical-align: bottom;"} habe ich schon probiert, das klappt aber nicht wunschgemäß.
 
statisch geht es nicht. positionier einfach die tabelle absolut mit bottom: 0px.
 
Irgendwie wiedersprichst Du Dir, danlo. :) Sofern das Div doch fest positioniert ist (relativ/absolut) lässt sich mit

position:absolute;
bottom:0;

die Tabelle am unteren Rand des Div's festtackern.
 
danlo schrieb:
...
positionier einfach die tabelle absolut mit bottom: 0px.
Das geht leider nicht, da die Elternelemente nicht fest positioniert sind.
Ich habe also keinen festen Bezugspunkt.

danlo schrieb:
statisch geht es nicht.
...
Das hatte ich befürchtet.
Werd ich dann wohl in HTML lösen: <td height=55px>
Und in der Tabellendefinition: "vertical-align: bottom;"

Trotzdem Danke für Eure Mühe ;).
 
Meinen Beitrag hast Du aber gelesen, oder?
maceis schrieb:
Das geht leider nicht, da die Elternelemente nicht fest positioniert sind.

Ich führ das mal etwas genauer aus.

Dem Elternelement gibst Du ein position:relative. Das tut Ihm und sonst keinem weh. Hat keinerlei Auswirkungen, bis auf dass alle absolut positionierten Kindelemente sich nicht mehr am Body, sondern am Elternelement ausrichten.

Wenn ich Dich richtig verstanden habe ist das Deine Lösung:

Code:
#footer {
   position:relative;
}
#footer table {
   position:absolute;
   bottom:0;
}
Code:
<div id="footer">
   <table>....</table>
</div>
 
dms schrieb:
Meinen Beitrag hast Du aber gelesen, oder?
Ja, habe ich ;).
dms schrieb:
...
Dem Elternelement gibst Du ein position:relative. Das tut Ihm und sonst keinem weh. Hat keinerlei Auswirkungen, bis auf dass alle absolut positionierten Kindelemente sich nicht mehr am Body, sondern am Elternelement ausrichten.
...
Soweit ich das bisher beobachten konnte, hat das überhaupt keine Auswirkungen. Bei Deinem unten angebenen Code erhalte ich dasselbe Ergebnis wenn ich das "position:relative" weglasse.

In beiden Fällen wird die Oberkannte der Tabelle an der Unterkante des Footers ausgerichtet.
Ich müsste also bottom: -"höhe der tabelle" schreiben.
Da die genau Höhe der Tabelle nicht sicher bekannt ist, funktioniert das aber auch nicht.
 
Das muss dann an irgendwelchen anderen Definitionen bei Dir liegen. Ich bau Dir nachher mal ein Beispiel zusammen, bin mir ziemlich sicher dass das so geht.
 
OK, wir haben beide recht. Theoretisch geht es so. ;) Praktisch auch, in allen von mir getesteten Browsern ausser Safari. Der stellt die Tabelle wie von Dir beschrieben unter dem Footer dar. Sogar der MacIE bekommt es besser hin. Ist also ein Bug in Safari wenn ich das richtig sehe.

Meine Testseite.
 
Vielen Dank für die Mühe, die Du Dir gegeben hast.

Sieht fast so aus als ob das wirklich eine Sache ist, die nur Safari betrifft.
Wie auch immer - mit der HTML Lösung kann ich leben; ist ja nur eine Kleinigkeit in einer einzigen Datei.
 
maceis schrieb:
Vielen Dank für die Mühe, die Du Dir gegeben hast.
Kein Ding. Man muss alles selbst mal ausprobiert haben um zu wissen was wirklich geht und was nicht. Ist also purer Eigennutz. ;) Und ich bin wieder eine Kleinigkeit schlauer.
 
Zurück
Oben Unten