22.02.2012, 21:49
|
|||
|
|||
Fußleiste von Div bis zum Seitenende laufen lassen
Hallo,
erstmal sorry für den komischen Threattitel, ich wusste wirklich nicht wie ich es hätte anders beschreiben sollen =) Also hier zunächst mein Testcase: Testcase Es geht um den schwarzgrauen Balken unten am Rand. Ich habe nun mehrere Möglichkeiten durchgespielt, aber scheinbar kann ich mein Problem mit dem StickFooterAlt nicht lösen. Ich möchte, dass der Grauschwarze Footer immer leicht überlappend mit dem Inhaltkasten anfängt und dann bis zum Seitenende durchläuft, so wie in diesem Beispiel.  Mein Problem liegt nun in den Bildschirmauflösungen. Bei einer Auflösung von 1280x1024 sieht das schon ganz gut aus. Bei 1920x Widescreen ist logischerweise mehr Platz zur Verfügung und der schwarzgraue Kasten dümpelt am Seitenende rum, ohne den Content zu überlappen. Warum das also so passiert ist mir klar, die Frage ist wie ich sowas lösen kann, bzw welchen Ansatz ich verfolgen muss. Ich hoffe mir kann geholfen werden =) Gruß ChOp 
|
| Sponsored Links |
|
22.02.2012, 22:58
|
||||
|
||||
|
Daher du eine feste Seitenbreite für deinen Wrapper nutzt ist das alles kein Problem und komplett mit FooterStickAlt zu lösen. Allerdings hast du ein Problem: Dein Wrapper hat eine Höhe von 100% + 30 Pixel margin-bottom + 30 margin-top von #header. Das macht bei einer Viewporthöhe von 1000 Pixel also eine Höhe von 1060 Pixel für deinen Wrapper.
Das margin-bottom von #wrapper und das margin-top von #header müssen also weg (ersetze das margin von #header durch padding) und du kannst problemlos mit FooterStickAlt arbeiten. Allerdings brauchst du auf der gezeigten Seite eine Höhe von 150 Pixel und ein margin-top von -150 Pixeln.
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
|
| Sponsored Links |
|
22.02.2012, 23:19
|
|||
|
|||
|
Zitat:
Weil wenn ich mir die Seite in 1280x1024 ansehe ist die überlappung größer also auf 1920x....das lässt sich wohl nicht vermeiden oder? Gruß ChOp
|
|
22.02.2012, 23:28
|
||||
|
||||
|
Ich habe eine Desktopfläche von insgesamt 3600 Pixeln Breite zur Verfügung. Selbst wenn ich es über den gesamten Bildschirm ziehe oder das Fenster kleiner mache als der #wrapper ist (960 Pixel) bleibt die Überlappung gleich. (Gestet mit Firefox 10.0.2 unter Windows 7)
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
|
|
22.02.2012, 23:45
|
|||
|
|||
|
Zitat:
|
|
23.02.2012, 15:58
|
||||
|
||||
|
Ich glaube, ich verstehe nicht einmal annähernd was du mir sagen willst. Aber ich kann ja gerne noch einmal sagen, was ich sagen will. Auf der im Einstiegspost verlinkten Website ist der Content immer (!!!) 980 Pixel breit. Dabei ist es egal ob das Browserfenster jetzt 700 Pixel oder 3600 Pixel breite hat.
Falls du die Höhe meinst mit den angegebenen Bildschirmbreiten: Das ist in der Tat so. Du kannst die Angabe aber auch prozentual machen.
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
|
|
24.02.2012, 16:39
|
|||
|
|||
|
Zitat:
HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title>test</title> <style type="text/css"> * { margin: 0; padding: 0; } html, body { height: 100%; } body { font: 100.1% Verdana, Geneva, Arial, Helvetica, sans-serif; } /* AussenContainer */ #container { min-height: 100%; position: relative; overflow: hidden; text-align: left; } #wrapper { margin: 0 auto; width: 960px; } #wrapper #inhalt { background-color: #bcbd00; color: #000; margin-bottom: -16000px; padding-bottom: 16000px; } #wrapper #inhalt p { padding-bottom: 160px; } #footer { background: #666; color: white; height: 150px; margin-top: -150px; position: absolute; width: 100%; bottom: 0; } #footer p.bereich-1 { background-color: olive; color: white; margin: 0 auto; width: 960px; text-align: center; line-height: 70px; } #footer p.bereich-2 { margin: 0 auto; width: 960px; text-align: right; line-height: 40px; } </style> </head> <body> <div id="container"> <div id="wrapper"> <div id="inhalt"> <p>Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt, wo er das Ding seines Lebens gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Gasse mitten im übel Gerade jetzt gedreht hatte und mit der Beute verschwinden wollte! Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht</p> </div> </div> <div id="footer"> <p class="bereich-1">FOOFER-BEREICH 1.......</p> <p class="bereich-2">FOOFER-BEREICH 2.......</p> </div> </div> </body> </html> Anhang 4531 ______ Gruß, Roland Geändert von K.Roland (28.07.2012 um 17:52 Uhr)
|
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| CSS - CMS - lange Menus Balken/BG oben? | shinobi | CSS | 3 | 13.10.2011 21:12 |
| Alle 3 Spalten bis zum Seitenende | runner | CSS | 1 | 02.09.2010 00:14 |
| Layout mit bis zu 7 Spalten (DIV) | michael-r | CSS | 3 | 23.06.2009 18:26 |
| preg_replace treibt mich in den Wahnsinn | olik | Serveradministration und serverseitige Scripte | 14 | 30.03.2009 14:30 |
| Simpel? IE zickt. Div bis unten und rechts anzeigen lassen. | Alibi | (X)HTML | 2 | 04.09.2004 23:15 |
Linear-Darstellung
