Melanu Rinots: position:fixed im Internet Explorer in einer XHTML-Seite

Beitrag lesen

Vielen Dank ChrisB,

Du hast recht. Deshalb formuliere ich meine Anfrage jetzt nocheinmal um:

Meine Seite ist fast genauso aufgebaut wie eine Beispielseite aus SELFHTML: Beispiel6. Den kompletten Quellcode habe ich hinten nochmal angehängt. Die Seite ist aber eine HTML 1.0 Transitional Seite.
Ich möchte aber eine XHTML 1.0 Strict Variante.

Ich habe es nicht geschafft, die Seite einfach umzuschreiben das es im IE gleich aussieht (außer, wie gesagt indem ich den IE in den quircksmodus versetze).

Kannst Du mir da helfen?
Besonders, dass das Dokument im IE6 gut aussieht wäre mir wichtig.

MfG

Melanu Rinots

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  
<html>  
<head>  
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">  
	<title>Feststehende Kopf- und Fußzeile</title>  
	<style type="text/css">  
		body  
		{  
			position:absolute;  
			background:#ffffff;  
		}  
		html, body  
		{  
			top:0; left:0; right:0;  
			min-height:100%;  
			margin:0;  
			padding:0;  
			width:100%;  
		}  
		#header_container  
		{  
			position:fixed;  
			top:0; left:0; right:0;  
			text-align:center;  
			margin:0;  
			height:3em;  
			z-index:3;  
		}  
  
		#header  
		{  
			position:absolute;  
			top:0; left:0; right:0; bottom:0;  
			height:100%;  
			background:#efefef;  
			z-index:3;  
			margin:0;  
			padding:0.2em;  
		}  
		#menu  
		{  
			position:fixed;  
			top:4em;  
			left:.5em;  
			width:9em;  
			border: 3px dotted #dedede;  
			padding:.5em;  
		}  
		#content  
		{  
			margin:0;  
			padding-top:4.85em;  
			padding-left:12em;  
			padding-bottom:3em;  
			z-index:2;  
		}  
		#footer_container  
		{  
			position:fixed;  
			bottom:0; left:0; right:0;  
			text-align:center;  
			margin:0;  
			height:2em;  
			z-index:3;  
		}  
		#footer  
		{  
			position:absolute;  
			top:0; left:0; right:0; bottom:0;  
			background:#efefef;  
			z-index:3;  
		}  
		  
		/* Nun für den MSIE */  
		* html, * html body  
		{  
			overflow:hidden;  
			bottom:0;  
			height:100%;  
		}  
		* html #header_container, * html #footer_container  
		{  
			position:absolute;  
			width:100%;  
			padding-right:16px;  
		}  
		* html #menu  
		{  
			position:absolute;  
		}  
		* html #header,* html #footer  
		{  
			height:100%;  
			position:static;  
		}  
		* html #content  
		{  
			position:absolute;  
			top:0; bottom:0; left:0; right:0;  
			height:100%;  
			width:100%;  
			overflow:auto;  
			margin:0;  
		}  
		  
		#menu li  
		{  
			list-style: none;  
			margin:0;  
			padding:0.3em;  
		}  
		#menu li#active  
		{  
			padding:0.5em;  
			text-decoration:underline;  
		}  
		#menu a:link, #menu a:visited  
		{  
			display:block;  
			background:#eeeeee;  
			color:black;  
			text-decoration:none;  
			margin:0;  
			padding:0.2em;;  
		}  
		#menu a:hover  
		{  
			background:#4f4f4f;  
			color:#ffffff;  
			text-decoration:underline;  
		}  
		* html #menu  
		{  
			margin:0;  
			width:10.5em;    /* Der IE soll das Element breiter darstellen, da margin und padding hier von  
							    der Breite abgezogen wird! */  
		}  
	</style>  
</head>  
<body>  
	  
	<div id="header_container">  
		<h1 id="header">Seite mit Header und Footer (2)</h1>  
	</div>  
	  
	  
	<ul id="menu">  
		<li><a href="beispiel1.htm">Einfacher Footer</a></li>  
		<li><a href="beispiel2.htm">Feststehender Footer</a></li>  
		<li><a href="beispiel3.htm">Feststehender Footer für den Internet Explorer</a></li>  
		<li><a href="beispiel4.htm">Kombination: Ein Footer für alle</a></li>  
		<li><a href="beispiel5.htm">Feststehende Kopf- und Fußzeile</a></li>  
		<li id="active">Alternative Positionierung, feste Navigation</li>  
		<li><a href="index.htm#fixierte_navigation_bsp">Zum Artikel</a></li>  
	</ul>  
	  
	  
	<div id="content">  
		  
		<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>  
  
		<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>  
  
		<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>  
  
		<p>Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>  
  
		<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.</p>  
  
		<p>At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. sanctus sea sed takimata ut vero voluptua. est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.</p>  
  
		<p>Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus</p>  
  
		<p>Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum e pluribus unum. Defacto lingo est igpay atinlay. Marquee selectus non provisio incongruous feline nolo contendre. Gratuitous octopus niacin, sodium glutimate. Quote meon an estimate et non interruptus stadium.</p>  
  
		<p>Sic tempus fugit esperanto hiccup estrogen. Glorious baklava ex librus hup hey ad infinitum. Non sequitur condominium facile et geranium incognito. Epsum factorial non deposit quid pro quo hic escorol. Marquee selectus non provisio incongruous feline nolo contendre Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum e pluribus unum.</p>  
  
		<p>Defacto lingo est igpay atinlay. Marquee selectus non provisio incongruous feline nolo contendre. Gratuitous octopus niacin, sodium glutimate. Quote meon an estimate et non interruptus stadium. Sic tempus fugit esperanto hiccup estrogen. Glorious baklava ex librus hup hey ad infinitum. Non sequitur condominium facile et geranium incognito. Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum e pluribus unum. Defacto lingo est igpay atinlay. Gratuitous octopus niacin, sodium glutimate.</p>  
  
		<p>Quote meon an estimate et non interruptus stadium. Sic tempus fugit esperanto hiccup estrogen. Glorious baklava ex librus hup hey ad infinitum. Non sequitur condominium facile et geranium incognito.</p>  
  
		<p>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc., li tot Europa usa li sam vocabularium. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilit&aacute; de un nov lingua franca: on refusa continuar payar custosi traductores. It solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.</p>  
  
		<p>Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. It va esser tam simplic quam Occidental: in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que Occidental es.</p>  
	  
	</div>  
	  
	<div id="footer_container">  
		<div id="footer">  
			<b>Und hier ist der endgültige Footer!</b>  
		</div>  
	</div>  
  
</body>  
</html>