Wie kann man einen Footer in HTML nach ganz unten setzen?

Hallo,

ich habe eine Frage: Auf meiner Webseite habe ich einen Footer, der, wenn der Bildschirm nicht so hoch ist wie die Seite selber ganz unten angezeigt wird, ich also scrollen muss, um ihn zu sehen. Wenn ich die Seite aber auf einem Monitor, der höher ist als die Seite, anschaue, dann wird der Footer "mitten auf dem Bildschirm" angezeigt.

Kennt jemand einen Link oder so, wo ich eine [elegante] Lösung mit CSS dafür finden kann?

Danke!

3 Antworten

RakonDark

Nutzer, der sehr aktiv auf gutefrage ist

im Thema HTML

01.11.2015, 13:31

html,body {height:100%}

#footer {position:absolute ; bottom: 0;}

den html und body bereich auf 100% der Ansicht

und dann per absolute anheften , aber denk daran alles im body wird drunter weg gezeigt . kann hässlich aussehen , also abstand lassen am ende damit nichts verloren geht .

threadi

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

HTML

01.11.2015, 21:24

Stichwort "Sticky Footer", siehe: http://www.html-seminar.de/sticky-footer-fussleiste-ganz-unten.htm

Woher ich das weiß:Berufserfahrung – mit dem Internet verbunden seit 1993

userfromberlin

Nutzer, der sehr aktiv auf gutefrage ist

im Thema CSS

01.11.2015, 13:42

position: fixed; bottom: 0px;

Ähnliche Beiträge

Webseiten verkaufen?

Ist es möglich Webseiten nur bestehend aus HTML und CSS zu verkaufen? Ich habe nicht vor krass aufewendige Seiten zu erstellen, sondern kleine Webseiten für Selbständige, lokale kleine Firmen usw. Also eine Seite wo die Dienstleistungen, Infos, Preise angezeigt werden. Dafür will ich halt auch nicht viel verlangen

Meine Webseiten sind: Responsive, modern, benitzerfreundlich und haben alles was eine Webseite haben sollte wie: Navigation bar, Footer, usw.

...zum Beitrag

Wie kann ich bei einer Html/CSS Website einstellen, wie weit ich nach unten scrollen kann?

Habe leider das Problem, dass ich meine HTML-Webseite sehr weit nach unten scrollen kann. Jedoch will ich das selber einstellen. Ich bitte um Hilfe!

...zum Beitrag

Button welcher beim Scrollen auf Webseite an gleicher Position unten rechts bleibt HTML?

Hallo,

ich habe eine Frage, wie muss ich das in CSS machen, das ein Button, welcher ein Bild ist, immer unten rechts in der Ecke angezeigt wird? Der Knopf ist eine <img>.

Muss ich in CSS img {position:fixed;} eingeben damit er beim scrollen immer da bleibt? Und muss wie soll ich den Code machen, damit er leicht durchsichtig unten rechts ist?

...zum Beitrag

Webseite mit Wix programmieren oder selbst HTML, CSS und JavaScript lernen?

Zuerst möchte ich sagen, dass ich bereits Erfahrungen mit Programmiersprachen, wie Python und C habe.

Ich habe mir letztlich eine einfache Webseite (die mir auch gefällt) mit HTML, CSS und JavaScript programmiert (sie ist noch nicht online). Ich habe mich dazu etwas eingelesen und fand es bis hierhin auch nicht sonderlich schwierig. Die Art, wie ich programmiert habe, ist vielleicht nicht unbedingt professionell, aber das Ergebnis stimmt.

Meine Frage wäre, ob es Sinn macht, den Weg über HTML, CSS ... zu wählen, wenn ich die Webseite aufwerten will (Datenbanken, ...), da es für unerfahrene Programmierer sehr komplex werden könnte. Sind hier Webseiten, die mit Wix erstellt werden, sehr viel eleganter, billiger und einfacher?

...zum Beitrag

Wie kann ich ein Foto in einer CSS oben links in die Ecke machen?

Moin, ich möchte ein Bild in meiner CSS oben links in die Ecke machen, damit das auf jeder Seite so ist.

Der Code für meine HTML:

<!doctype html>
<html>
<head>
<title>Informatik</title>
<link href="Kurz.css" rel="stylesheet" type="text/css">
</head>
<body>
<footer></footer>
<script language="javascript" type="text/javascript" src="Footer.js"></script>
</body>
</html>

Der Code für CSS:

html {
  height: 100%;
}
body {
 background-image: url("Bilder/getraenkeguenther.jpg");
 background-repeat: no-repeat;
 background-position: left top;
 min-height: 100%;
 margin: auto;
 display: flex;
 flex-direction: column;
}
footer {
  margin-top: auto;
  height: 200px;
  text-align: center;
background-color: deepskyblue;
}

Der Code der JS:

var footer = `
<a>Impressum</a>
`;
document.getElementsByTagName("footer")[0].innerHTML = footer;

Das backgroundimage soll quasi als einzelnes Bild oben links in die Ecke

...zum Beitrag

Bild im footer?

Guten Tag

Ich habe ein Problem mit einem Bild im footer (statt wie beim letzten Mal in der Navbar).

Mein HTML Footer:

<h3>Matthias<span>Heiniger</span></h3>

<a href="#">Bewerbung</a>

<a href="#">Projekte</a>

<a href="#">Workbooks</a>

<a href="#">Kontakt</a>

</p>

</div>

</footer>

Mein CSS Code für das Bild zum einfügen:

footer {

background-image: url(/03_HTMLCSS/01_Website/Bilder/VektorDesignElemente/png/UntenLnks2_1.png);

background-repeat: no-repeat;

background-size: 19%;

position: relative;

z-index: 1;

font-size: 25px;

padding: 0;

}

Momentan wird das Bild so angezeigt:

Mein Problem: Das Bild (Das Blaue Bild) möchte ich unten Links platzieren aber es geht nicht bis an den "Boden"

Vielen Dank für die Antworten

Freundliche Grüsse

...zum Beitrag

Wie bekomme ich das Bild runter (Html, css)?

Ich wollte bisschen mit html üben und wollte ein bild in die mitte des textrahemns in der mitte setzen doch egal wie ich es ändere es bewegt sich nicht drunter rein ^^ was hab ich falsch gemacht?

...zum Beitrag

HTML/CSS Button erstellen, der unten rechts fixiert ist?

Ich brauch einen Cookies-Hinweis, der soll als Button unten rechts angezeigt werden, ohne, dass sich dieser beim scrollen mitbewegt. Hab schon gegooglet, bin wohl zu dumm, würd mich über einen responsiven Code freuen (<button>)

...zum Beitrag

Der footer wird mitten auf der seite angezeigt, wie kann ich das beheben?

Pastebin: https://pastebin.com/uRDX8h7n

(Ich nutze pastebin, da mein code zu lang ist...)

Passwort: 55312

Der footer wird in der mitte meiner seite angezeigt, er sollt allerdings unten angezeigt werden.

ich bitte um hilfe!

...zum Beitrag

Wie kann man den Header immer beim runter scrollen sehen, css + html?

...zum Beitrag

Gute KI um HTML-, CSS- und JS-Code für eine Webseite zu erstellen?

Hallo kennt jemand eine gute KI, um HTML-, CSS- und JavaScript-Code für eine Webseite zu erstellen?

...zum Beitrag

HTML Webseite gratis hosting?

Ich suche einen Anbieter der meine HTML + CSS Webseite gratis hoasted.

Ich benötige nicht viel Speicherplatz, da die Bilder Extern gespeichert werden.

...zum Beitrag

Wie kann ich die Elemente im Footer zentrieren in CSS?

Ich habe mehrere Links im Footer, welche in CSS mit einem Flex also (Display: flex, flex-Wrap: Warp) hintereinander in einer Zeile stehen.

jedoch sind diese linksbündig & wollen nicht in die Mitte gehen.

ich habe es schon über den Footer mit Text-align probiert und auch schon über die <p>‘s in denen die Links stehen... klappt leider alles nicht.

...zum Beitrag

Gibt es Tabulatoren für Webseiten?

Bei uralten Schreibmaschinen konnte man Tabulatoren setzen. Bei Druck auf die Tab-Taste rutschte der Wagen bis dahin vor.

Das ist mir mit HTML oder CSS nicht bekannt, aber ich bin vielleicht nicht auf dem neuesten Stand.

Als CSS-Behelf definiere ich inline-blocks pro Zeile.

...zum Beitrag

Was möchtest Du wissen?

Deine Frage stellen