div unten ausrichten

[Sebastian]

Hallihallo.
Ich habe folgendes Problem:

<div id="seite">

<div>Ganz viele</div>
  <div>Divs mit</div>
  <div>verschiedenem Inhalt</div>

<div id="bottom"></div>

</div>

----

div#seite{
  position:relative;
  width:790px;
  margin:auto;
  height:100%;
}

div#bottom {
  width:18px;
  height:18px;
  background-image:url(ding.gif);
  background-repeat:no-repeat;
  bottom:0px;
  left:780px;
  position:absolute;
}

Im Seiten-Div befindet sich der ganze Inhalt der Seite. Ziel ist es jetzt, dass dieser Bottom-Div gaaaaaanz unten rechts angezeigt wird und zwar unabhängig davon wieviel Inhalt drin ist.
Momentan steht er aber ganz oben rechts auf der Seite. Die horizontale Ausrichtung passt. Nur vertikal stimmt's nicht.

Ich benutze den Web Developer 1.1.8.
Dieser zeigt mir auch an, dass sich 'bottom' innerhalb von 'seite' befindet und dass 'seite' auch wie gewollt den gesamten Inhalt umschließt.

Was muss ich tun, um 'bottom' auch in Richtung 'bottom' zu bringen?

Viel Dank schonmal für die Antworten.

[henman]

hallo,

Was muss ich tun, um 'bottom' auch in Richtung 'bottom' zu bringen?

bottom sagen, sich hinten anzustellen, wenn er schon zuletzt kommt und nicht <http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=über alle anderen hinwegzufliegen>.

[Sebastian]

hallo,

Was muss ich tun, um 'bottom' auch in Richtung 'bottom' zu bringen?

bottom sagen, sich hinten anzustellen, wenn er schon zuletzt kommt und nicht <http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=über alle anderen hinwegzufliegen>.

Wie meinen?
Ich sollte vielleicht noch erwähnen, dass alle anderen divs, die in Seite existieren, auch absolut positioniert sind.

Ich habe allerdings festgestellt, div#seite doch nicht wie gewünscht expandiert. Es ist quasi nur eine ca. 20px große Leiste von oben beginnend, weshalb der div#bottom auch bei bottom:0px ganz oben ist.

Wenn ich jetzt folgendes hinzufüge:

html,body,div#seite {
  height:100%
}

dann erstreckt sich div#seite bis nach unten.

Jetzt treten aber folgende Fälle ein.

1. Der eigentliche Seiteninhalt ist sehr kurz und nimmt nicht den gesamten Bildschirm ein. Dann erstreckt sich div#seite trotzdem bis zum Bildschirmende und div#bottom wird unten angezeigt.
Ich möchte aber eher, dass div#seite nur so weit expandiert, dass es seinen Inhalt einschließt, damit div#bottom direkt unter dem Inhalt ist.

2. Der eigentliche Seiteninhalt ist größer als die Bildschirmvertikale. Man muss also nach unten scrollen, um ans Ende zu gelangen. Dann befindet sich div#bottom am unteren Bildschirmrand, egal ob das nun in der Mitte des Inhaltes ist oder nicht. Wenn man nun nach unten scrollt, wandert div#bottom nach oben und klebt irgendwo mitten in der Seite.

Ich möchte eigentlich nur, dass div#bottom nach den anderen divs innerhalb von div#seite kommt.
Was muss ich also tun, damit div#seite mitwächst mit seinem Inhalt und nicht eine kleine Minileiste am oberen bildschirmrand bleibt?

[Beat]

Ich möchte eigentlich nur, dass div#bottom nach den anderen divs innerhalb von div#seite kommt.
Was muss ich also tun, damit div#seite mitwächst mit seinem Inhalt und nicht eine kleine Minileiste am oberen bildschirmrand bleibt?

Herzlichen Glückwunsch. Du hast einen der Effekte von position:absolute entdeckt. Behebe das durch Vermeidung.

mfg Beat