CSS-Problem bitte helfen - Wichtig

[Critone]

Hey,

ich habe ein Problem.

Screen:

 Spoiler

Der Footer ist über/unter dem Content..wenn der Content kürzer ist dann ist das NICHT so. Dann ist der Footer am unteren Bildschirmrand "getakert" so wie es sein soll. Aber wenn der Content durch den Inhalt auf verschiedenen Seiten länger wird, dann überlappt sich das.

Ich will aber das zwischen dem Content oder "Main-Bereich" und dem Footer mindestens 50px Platz sind aber ich weiß nicht wie ich das hinkriegen soll :/

Footer:

#footer{
	position:absolute;
	bottom:0px;
	height:50px;
	padding-top:50px;
	text-align:center;
	width:100%;
	background:url(../img/layout/footer.png) repeat-x;
	color:#322723;
}

So sieht es aus, wenn der Content kürzer ist und so sollte es immer aussehen:

 Spoiler

Würde mich über schnelle Hilfe freuen.

Gruß
Critone

[.DOPE.]

versuchs mal mit position:relativ;

[Hiris]

Versuchs mal mit margin-top: 50px; ôo

[Critone]

Dann sieht das so aus :/



Uploaded with

Originally Posted by Hiris

Versuchs mal mit margin-top: 50px; ôo

Das hat nichts gebracht. Habe ich ja auch schon probiert :/

[Hiris]

Mit dem margin top siehts so aus? ôoô
Edit: wenn du die echte url mit der website posten würdest, könnte ich dir schnell helfen

[.DOPE.]

ach tut mir leid habe voll falsch gelesen
aber trzdem solltest du es auf relativ lassen.. Ist immer ein vergleich zu 1(sehr gut) und 2(nur gut)..

btw: Hiris so würde ich es auch sagen..

[Critone]

Originally Posted by Hiris

Mit dem margin top siehts so aus? ôoô

Nein aber mit margin-top verändert sich nichts. Da ist es genauso wie oben.

Ja dann muss ich die Homepage ebend auf einem Webspace hochladen. 2min ^^


€:

So hier die Seite:

Und hier für den Bug die Seite:

Achja und irgendwie sieht man den Banner nicht..den sieht man irgendwie nur wenn ich local hoste...hm ka

[NotEnoughForYou]

Wer floatet muss auch clearen....

#footer{
	position:relative;
	height:50px;
	padding-top:50px;
	text-align:center;
	width:100%;
	background:url(../img/layout/footer.png) repeat-x;
	color:#322723;
        clear:both;
}

alternativ kannst du um alles noch ein div setzen und dem die höhe 100% geben , dann ist der footer immer ganz unten.
Oder den footer in ein relatives div setzen, dannach dem footer wieder eine absolute geben mit bottom:0; und mit dem relative div clearen... dann sollte es hinhauen

[Critone]

Dankeschön, das sieht schon besser aus

 Spoiler

Uploaded with

Aber wie du auf dem Screen siehst ist der footer direkt an der sidebar rechts...ich möchte aber das er mindesten 50px davon entfernt ist aber mit margin-top habe ich das nicht hinbekommen :/
Also doch habe ich aber der footer hat sich erst ab 400px ein kleines stück tiefer bewegt also glaube ich das der footer sich irgendwie am Header orientiert :/ wie änder ich das?


Edit:

Mit diesem Code sieht auch alles super aus, also so wie es sollte:

#footer{
	background:url(../img/layout/footer.png) repeat-x;
	color:#322723;
	position:absolute;
	bottom:0px;
	left:auto;
	right:auto;
	width:100%;
	height:100px;
}

#footer p{
	text-align:center;
	padding-top:25px;
}

Bild:

 Spoiler

Wenn man jedoch wieder diese eine Seite aufruft wo der Content so lang ist dann sieht es wieder so aus:

 Spoiler

Würde mich echt über Hilfe freuen.