nicht angemeldet
footer richtig unter ein zentriertes div platzieren
Hallo,
ich möchte gern unter einen horizontal und vertikal zentrierten Content einen footer platzieren, der über die gesamte Bildschirmbreite laufen soll. Ich habe es bis jetzt folgendermaßen mit CSS gelöst: Mit "margin", "positition","top" und "left" habe ich den Content mit einer festen Breite in die Mitte gesetzt. Den footer habe ich 5000Pixel breit gemacht, damit er auf alle Fälle nicht beschnitten wird und ihn dann mit der gleichen Strategie wie den Content platziert (nur etwas unterhalb). Damit kein Scrollbalken durch die hohe Breite auftaucht, habe ich den Scrollbalken per CSS ausgeblendet.Ich wäre sehr dankbar, wenn einer
eine elegantere Lösung parat hätte...
vereinfacht schaut die Site so aus:
HTML:
<div id="Box">
</div>
<div id="footer">
</div>
</body>
CSS:
body { overflow: hidden; }
#Box {
width:960px;
height:500px;
background-color: #F30;
top:50%;
left:50%;
position:absolute;
margin-left:-480px;
margin-top:-250px;
}
#footer {
width:5000px;
height:30px;
background-color: #FF0;
top:50%;
left:50%;
position:absolute;
margin-left:-2500px;
margin-top:280px;
}
-
eine elegantere Lösung parat hätte...
100% Breite mit einem zentrierten Footer halte ich für wesentlich praktikabler.
-
Hallo suit,
vielen Dank für Deine Antwort. Meinst Du so?
#footer {
width:100%;
height:30px;
background-color: #FF0;
top:50%;
left:50%;
position:absolute;
margin-left:-50%;
margin-top:280px;}
viele Grüße,
orange
eine elegantere Lösung parat hätte...
100% Breite mit einem zentrierten Footer halte ich für wesentlich praktikabler.
-
Hallo suit,
vielen Dank für Deine Antwort. Meinst Du so?
#footer {
width:100%;
height:30px;
background-color: #FF0;
top:50%;
left:50%;
position:absolute;
margin-left:-50%;
margin-top:280px;}
wenn der footer unten sein soll, was tut dann die top- und die margin-top-Angabe?
Und was tut left und margin-left, wenn das ding doch links kleben und die volle Breite haben soll?
-
Hallo suit,
vielen Dank für Deine Antwort. Meinst Du so?
#footer {
width:100%;
height:30px;
background-color: #FF0;
top:50%;
left:50%;
position:absolute;
margin-left:-50%;
margin-top:280px;}
wenn der footer unten sein soll, was tut dann die top- und die margin-top-Angabe?
Und was tut left und margin-left, wenn das ding doch links kleben und die volle Breite haben soll?
»»
ich habe noch nicht viel CSS Erfahrung und weiss nicht, wie ich den footer sonst unter einen horizontal und vertikal zentrierten Content platzieren kann.
Ich dachte, ich brauche diese Angaben um ebenfalls vom Mittelpunkt auszugehen, damit der footer bei jeder Bildschirmgröße im gleichen Verhältnis zum Content steht. Kannst Du mir bitte Deine CSS Version schreiben?
-
-
-
-
