Antworten zum Thema „Footer Problem, "bleibt nicht im container" :-(“

loozy · 14.11.2006

Hi Leute ich hab folgendes html:

Code:

<body>
<div id="center">
		<div id="container">
						<div id="headerl" ></div>
						<div id="headerr" ></div>
						<div id="navliste" align="left">
									<div id="navcontainer">
												<ul id="navlist">
													[*][url="index.php?nav=navigation/home_nav&inhalt=home"]Home[/url]
													[*][url="index.php?nav=navigation/ueber_uns_nav&inhalt=ueber_uns"]Über uns[/url]
													[*][url="index.php?nav=navigation/leistungen_nav&inhalt=leistungen"]Leistungen[/url]
													[*][url="index.php?nav=navigation/methodik_nav&inhalt=methodik"]Methodik[/url]
													[*][url="index.php?nav=navigation/home_nav&inhalt=referenzen"]Mandanten-Meinungen[/url]
													[*][url="index.php?nav=navigation/anfahrt_nav&inhalt=anfahrt"]Anfahrt[/url]
													[*][url="index.php?nav=navigation/kontakt_nav&inhalt=kontakt"]Kontakt | Impressum[/url]
												[/list]
									</div>
						</div>
						
						<div id="header2" ></div>
						<div id="navi2" > <?php include("$nav.php"); ?> </div>
						<div id="maincol"> <?php include("$inhalt.php") ?></div>
					<div id="footer" ></div>
		</div>
</div>
</body>

und dazu folgende Auszüge aus dem css:

Code:

#container {
	position: absolute;
	width: 800px;
	height: 800px;
	border: dotted 1px #805e47;
	background: url(bg2.gif);
}

#headerl {
	height: 140px;
	float: left;
	background-color: #ddd5bc;
	background: url(images/striche2.gif);
	width: 200px;
}
#headerr {
	height: 140px;
	float: left;
	background-color: #f3f1e8;
	width: 600px;
	background: url(images/logo2.gif);
}
#navliste {
	float: left;
	background: #8e8561;
	width: 200px;
	height: 150px;
	margin: 0;
	overflow: hidden;
}

#header2 {
	height: 150px;
	float: left;
	width: 600px;
	background: #f3f1e8 url(images/header2.gif) no-repeat;
}
#navi2 {
	width: 200px;
	float: left;
	height: 490px;
	background: #c1b486;
}
#content {
	margin-top: 15px;
	margin-left: 15px;
	color: #300;
	font: 12px Arial, Helvetica, sans-serif;
	overflow: hidden;
}

#maincol {
	float: left;
	display: inline;
	position: relative;
	width: 600px;
}

#footer {
	height: 20px;
	width: 800px;
	background: #8e8560;
	float:left;
}

Im Mozilla, Safari ist alles wunderbar / Auf dem Mac
Auf dem PC haut mein Footer immer nach unten, ausserhalb vom Container ab wenn ich mit dem IE Seiten aufrufe die ganz knapp noch auf in den content passen.

Wie kann ich dieses Desaster retten?

Vielen Lieben Dank!!!

Elisa

Guddi · 14.11.2006

Hallo Elisa,

So wie es scheint willst du doch den ganzen Inhalt doch nur auf 800x600px haben, dann nimm doch einfach ?position:absolute;? dann hast du das Problem nicht.

loozy · 14.11.2006

das verstehe ich jetzt nicht ganz, ich hab das mit den position:absolute; extra rausgenommen auf einen Rat hin dass das nicht gut ist wenn man das Fenster verkleinert.

Aber das Problem ist definitiv der Footer der nach unten rutscht wenn mein include zu lange wird...

PASST NICHT:
passt