Div zentrieren mit CSS klappt nicht

Janchu88 · 28.11.2011

Hab grad ein Problem und egal wie ich es versuche, ich werd nicht wirklich schlau draus....

ich habe folgendes Grundgerüst an Code erstellt, sowohl der HTML als auch der CSS anteil sind W3C Valide. IE8 zeigt es korrekt an, Firefox 8.0 ignoriert die deklarierten DIV´s komplett!? Evtl jemand ne Ahnung, was da los ist?

IE8:

FF8

index.php

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> Mein Showroom </title>
  <meta http-equiv="X-UA-Compatible" content="IE=8">
  <meta http-equiv="X-UA-Compatible" content="IE=7">
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">

  <meta name="Description" content="">
  <meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" >
  <link rel="stylesheet" href="css.php" type="text/css">  
 </head>

 <body>

	<div class="main">
  
		<div class="banner">
	
			text hier1<br>

			
		</div>

		<div class="menu">

			text hier2<br>
			
		</div>

		<div class="content">

			text hier3<br>

			text hier3<br>
			text hier3<br>
			text hier3<br>
			text hier3<br>
			text hier3<br>
			text hier3<br>

			text hier3<br>
			text hier3<br>
			text hier3<br>
			text hier3<br>
			text hier3<br>
 
 
 
		</div>

	</div>

  </body>

</html>

css.php

Code:

Div.main
{
   position:relative;
   top:0px;
   left:0px;
   margin: 0 auto;
   text-align: left;
   width: 1000px;
   z-index: 0;
   border: 1px solid;

}

Div.banner
{
	
	border: 1px solid;
    position: relative;
    left: 0px;
    width: 1000px;
    height: 75px;
    z-index: 1;
}

Div.menu
{
	border: 1px solid;
	position:relative;
	width: 1000px;
	height: 50px;
	z-index: 1;
}

Div.content
{
	position: relative;
	border: 1px solid;
	width: 1000px;
	z-index: 1;
}

nehalist · 28.11.2011

Prinzipiell: hochgeladen wäre das wesentlich gemütlicher zu durchstöbern. Aber okay.

Mach mal altmodische Fehleranalyse und färb irgendeinen Div mit rotem Hintergrund ein. Wenn der FF dann keinen roten BG anzeigt, ignoriert der Browser deine CSS Datei vollkommen.

Weitere mögliche Fehlerquellen:
- warum jagst du die CSS Datei durch den Compiler? Änder die Dateieendung auf .css und foltere deinen Server nicht mit jedem Furz

- "X-UA-Compatible" sind mir nicht geläufig. Probier testweise mal ohne. Kann natürlich auch sein das es nicht daran liegt, aber ich habe gefühlt hunderttausend Webseiten online gestellt - und mir kam dabei nie dieser Meta unter.

Schöne Grüße

pajaa · 29.11.2011

top:0px;
left:0px;

Wie soll das denn zentriert werden?
Du hast da ziemlich viele unnötige, verkomplizierende Deklarationen drin. Schmeiß doch mal die ganzen z-indexe raus.

Suche

Div zentrieren mit CSS klappt nicht

Janchu88

Kapitän zur See , HWLUXX Vize-Superstar

nehalist

Enthusiast

pajaa

Super Moderator