|
|||
footer div positionieren
Hallo,
ich versuche gerade einen footer als div container unterhalb meines Inhalts der Seite zu platzieren. Allerdings sind alle Div's auf der Seite mit position:absolut und festen left und top Werten platziert. Ich würde jetzt gerne das der footer sich jenachdem wie lange der TExt auf der Seite ist, immer unten dran platziert. Hat jemand eine Idee wie das gehen soll? Momentan ist der Footer immer unten am Browserfenster positioniert, das wollte ich aber eben ändern. Wäre super wenn jemand eine Idee hat Gruß Philippsen Geändert von philippsen (02.03.2010 um 09:45 Uhr) |
Sponsored Links |
|
|||
Eine Seite nur aus absoluten Elementen zu machen ist gar nicht zu empfhelen, denn der einzige Weg das zu verwirklichen was du machen möchtest ist wenn du mit relativen/statischen Positionen arbeitest, und der Platz automatisch reserviert wird.
Ein Lösungs Ansatz wäre (weis aber nicht genau ob es funktioniert), den div.inhalt auf position relative zusetzen und den Footer in der Hierachie darunter. Dann sollte der Platz auch reserviert sein. Ansonsten kannst du dir mit JavaScript helfen, allerdings musst du dann auch eine Version für die 10% der Menschen mahcen die JavaScript deaktiviert haben. |
Sponsored Links |
|
|||
Hi,
also eine Möglichkeit fiele mir schon ein, zumindest, wenn du weißt, welches deiner absolut positionierten Elemente am weitesten unten sein wird. Dann kannst du's etwa so machen (ich hab für das Content-Element extra mal bloß 80% Breite genommen, damit man sieht, dass der Footer trotzdem 100% Breite haben kann) Code:
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Title</title> <script type="text/javascript" language="javascript"> </script> <style type="text/css"> #content { position: absolute; top: 10px; left: 10%; width: 80%; padding-bottom: 2em; background-color: yellow; } #footer { bottom: 0px; position: absolute; width: 125%; margin-left: -12.5%; margin-right: -12.5%; background-color: green; } </style> </head> <body> <div id="content"> First line<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> [Content]<br/> Last line<br/> <div id="footer">Footer</div> </div> </body> </html> Chris |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Fragen zu CSS und Joomla | DOKTOR | CSS | 2 | 23.05.2011 19:29 |
Brauche Hilfe: Schwarzes Nichts | Zwox | CSS | 10 | 19.11.2010 16:53 |
Header entfernen | tripple | CSS | 17 | 15.06.2010 15:41 |
Schriftfarbe in den Eintragungsfeldern von jforms | Steveislucky | CSS | 2 | 16.03.2010 10:59 |
CSS Text nebeinander? | carstiee09 | CSS | 13 | 13.11.2009 19:18 |