Impressum u.a. an unteres Ende des Viewports

[Kniffel]

Hallo!
Wie erreiche ich, dass eine Fußzeile stets am unteren Ende des Viewports angezeigt wird, auch wenn man bei längeren Inhalten nach unten scrollt?

 

[Patella]

...in CSS mit position: fixed; in Verbindung mit dem z-index. Siehe Quelltext, hier ein Beispiel für einen oben "angeklebten" Bereich, geht analog genauso für unten, dann Eigenschaft top entsprechend in bottom ändern. Der z-index sorgt dafür, dass der gewünschte Bereich im Vordergrund bleibt (gehe mal davon aus, dass das so sein soll). Der restliche Seiteninhalt muss dann ebenfalls den z-index erhalten, dann aber mit dem Wert 1.


header {

position: fixed;

top: 0;

left: 0;

width: 100%;

height: 200px;

z-index: 2;

background-color: #F5DEB3;

color: green;

}

 

[Kniffel]

Hallo,
danke für die Antwort. Aber entweder habe ich mich falsch ausgedrückt oder etwas falsch gemacht.
in dem Fiddle codepen.io/my1codepen/pen/dPGGNgK
kommt die Fußzeile erst am gesamten Ende des Dokuments und nicht immer (wenn ich nach unten scrolle).

 

[scatello]

Siehe https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_fixed_footer

 

[Patella]

???
Was ist denn jetzt Dein Ziel? Soll der Fußbereich (ich gehe davon aus, das meinst Du mit "Fußzeile") der Webseite am unteren Bildschirmrand "kleben" oder einfach am Ende der Seite hängen? Letzteres wäre ja der Standard (ohne irgendwelche speziellen Änderungen).

Was Du mit "Fiddle..." meinst, verstehe ich nicht. Was soll das sein?
Der W3C-Link beschreibt exakt das, was ich oben bereits als Quelltext schrieb.

 

[Sempervivum]

@Kniffel In deinem codepen verwendest Du einen falschen Selektor, richtig wäre p.fuss weil es sich um ein p-Element mit der Klasse "fuss" handelt.

Außerdem verwendest Du besser "sticky" statt "fixed" um Probleme mit Überlappung zu vermeiden.

Und es bietet sich an, das Tag <footer> für die Fußzeile zu verwenden.

 

[Kniffel]

@Kniffel In deinem codepen verwendest Du einen falschen Selektor, richtig wäre p.fuss weil es sich um ein p-Element mit der Klasse "fuss" handelt.

Außerdem verwendest Du besser "sticky" statt "fixed" um Probleme mit Überlappung zu vermeiden.

Und es bietet sich an, das Tag <footer> für die Fußzeile zu verwenden.

Ich weise darauf hin, dass das Codepen aufgrund des Vorschlags von Patellea gemacht wurde.

 

[Kniffel]

???
Was ist denn jetzt Dein Ziel? Soll der Fußbereich (ich gehe davon aus, das meinst Du mit "Fußzeile") der Webseite am unteren Bildschirmrand "kleben" oder einfach am Ende der Seite hängen? Letzteres wäre ja der Standard (ohne irgendwelche speziellen Änderungen).

Ich habe anfangs von scrollen gesprochen, also immer sichtbar.

Was Du mit "Fiddle..." meinst, verstehe ich nicht. Was soll das sein?

Füge soviel weitere Zeilen ein, bis ein Scrollen möglich ist, dann Siehst Du den Effekt

Der W3C-Link beschreibt exakt das, was ich oben bereits als Quelltext schrieb.

Leider nein.

 

[Kniffel]

Hallo!
Wie erreiche ich, dass eine Fußzeile stets am unteren Ende des Viewports angezeigt wird, auch wenn man bei längeren Inhalten nach unten scrollt?

Hat sich erledigt!

 

[Nitrosamin]

Und die Lösung?
Vielleicht möchte ja jemand anderes auch so etwas umsetzen?

 

[tk1234]

Crossposting: https://forum.selfhtml.org/self/202...n-unteres-ende-des-viewports/1821899#m1821899

 

[Sempervivum]

Stimme @Nitrosamin zu, es wäre angebracht gewesen, wenn Du geschrieben hättest, wie deine Lösung aussieht und wo Du sie her hast.

Und, BTW, die Lösung auf Selfhtml entspricht genau dem, was ich in Posting #6 vorgeschlagen hatte.