Zum Inhalt springen

positionierung des footers

Erstellt am 18. Dezember 2006 · 4 Antworten · letzte Antwort am 19. Dezember 2006

Tags: HTML & CSS, Frage

cavalorn ·

hallo,

ich habe mal wieder was mit meiner seite, was dermaßen nervt #angry#

ich weiß nicht, ob es css oder css in verbindung mit typo3 verursacht, aber seht selber:
ich habe einen footer in einem div container, ich krieg es aber einfach nicht gebacken, dass der footer unter dem anderen content angezeigt wird. wie kann man das realisieren, dass der footer immer unter dem content steht, egal wie kurz oder lang dieser ist????

auf selfhtml habe ich mich kaputt gelesen, finde aber nichts entsprechendes...

der container "footer" soll unter dem container "rahmen" sein.
wer findet die lösung für dieses problem? ich verstehs echt nicht....

so siehts im html aus:

<div id="rahmen" style="min-height:700px" margin-bottom:="" 30px="">
		  <div class="left_side">
					<div id="inhalt" style="position:static; width:470px;left: 20px" min-height:700px="">###LINKS###</div>
				
				
				<div id="li" style="margin-top: 30px; position:absolute;loat:left">		
				<p>###LI###
				<p>				</div>
				
				<div id="re" style="margin-top: 30px; float:right">		
				<p>###RE###
				<p>		  		</div>
			
			
		</div>
		
		
	</div>
	
	
	
	</div>

	<div id="footer">
			<div class="padding">
				Copyright © 200<span lang="de">7</span>
			<a href="#">Kontakt</a> | <a href="#">Impressum</a></div>
		</div>

Und das sind die wichtigen Teile aus dem css:

#main .left_side {
	float: left;
	width: 500px;
	min-height: 700px;
	background: #FFF;
	padding:15px 15px 0px 20px;
	margin:20 px 0 px;
	position:absolute;
	left: 31px;
	top: 423px;

#footer { 
	clear:left;
	height: 43px;
	width:535px;
	color:#ccc;  
	background: url('../images/footer.jpg') no-repeat top; 
	font-size:90%; 
	margin-top:30px;
	margin-left: -20px;
	position:static;
	text-align:center;
	}

#footer .padding { padding: 10px 0px 0px 0px; margin-top:30px;}
#footer .right { 
	float:right; 
	clear:right; 
	text-align:right; 
}

#footer a { color: #E0F5FF; }

viele grüße
thomas

ttb ·

position:static; ist die Voreinstellung. Was du vermutlich eher meinst ist position:fixed; im Bezug auf den IE. 😉

Zum eigentlichen Problem: Du willst doch, dass du der Footer komplett unten ist. Wieso lässt du ihn dann im Fluss (clear:left😉 anstatt ihn komplett aus dem Fluss zu nehmen (clear:both😉?

cavalorn ·

vielen dank für eure antworten. das "static" kann ich ja mal rausnehmen, ist ja die voreinstellung (war nur für mich wegen der übersicht)

den textumfluss hab ich mal geändert, das war natürlich falsch.

ich wollte die position des footers aber nicht auf fixed - der footer soll immer unten nach dem seitencontent erscheinen, egal ob der content lang oder kurz ist. mein problem war, dass der footer immer an einer stelle im dokument "fest" platziert ist, als hätte ich irgendwie für die positionierung einen x und y wert angegeben...

klappt dummerweise immer noch nicht 🙁
habt ihr noch ideen?

cavalorn ·

himmel herr gott, es hat geklappt. gerade rechtzeitig, ich wollte gerade nen eimer wasser über mein notebook schütten 😉

ich hab die div container mal ein bisschen anders verschachtelt. bei meinem nächsten projekt mach ich sowas mal übersichtlich, damit solche fehler gar nicht passieren können

		  <div class="left_side">
					<div id="inhalt" style="position:static; width:470px;left: 20px"; min-height:700px>###LINKS###</div>
				
				
				<div id="li" style="margin-top: 30px; position:absolute;float:left">		
				<p>###LI###
				<p>				</div>
				
				<div id="re" style="margin-top: 30px; float:right">		
				<p>###RE###
				<p>		  		</div>
		
		
		
	
	
	<div id="unten" style="margin-top:30px">
	
	<div id="footer">
			<div class="padding">
				Copyright © 200<span lang="de">7</span>
			<a href="#">Kontakt</a> | <a href="#">Impressum</a></div>
		</div>
		</div>
		</div>
	</div>

wirklich zum wahnsinnig werden sowas #angry#