✔ IE = OK, FF = falsche Darstellung

[Apfelkuchen]

IE = OK, FF = falsche Darstellung -> Div Box zentrieren

Hallo. Ich habe ein kleines Problem bei einer meiner div boxen. Hier der CSS code:

body 	{
   	  background-color: #e1ddd9;
   	  font-size: 10px;
   	  font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif;
   	  color:#564b47;  
   	  text-align: center;
   	scrollbar-face-color:#e1ddd9;
   	   scrollbar-arrow-color:#000000;
   	   scrollbar-track-color:#e1ddd9;
   	   scrollbar-shadow-color: #e1ddd9;
   	   scrollbar-highlight-color: #e1ddd9;
   	   scrollbar-3dlight-color: #000000;
   	   scrollbar-darkshadow-Color:#000000;
   	}
   
   
   #inhalt { 
   	  font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif;
   	  width: 30%;
   	  padding: 0px;
   	  text-align: justify;
   	  background-image:url(bg.jpg);	
   	}
   
   .clickme	{
   		cursor: hand;
   		}

#inhalt ist die zentrierte box.

Im IE wird die Box zentriert dargestellt. Und im FF links. Warum ist das so?

Hier meine Site: http://www.farukp.com

 

[Maik]

Formatiere die DIV-Box mit einem Aussenabstand margin:

#inhalt { 
margin: 0 auto; /* FireFox, IE6, Mozilla, NN, Opera, u.ä. */
font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif;
width: 30%;
padding: 0px;
text-align: justify;
background-image:url(bg.jpg);	
}

 

[Apfelkuchen]

Formatiere die DIV-Box mit einem Aussenabstand margin:

 #inhalt { 
 margin: 0 auto; /* FireFox, IE6, Mozilla, NN, Opera, u.ä. */
 font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif;
 width: 30%;
 padding: 0px;
 text-align: justify;
 background-image:url(bg.jpg);	
 }

danke, das hat prima funktioniert.

Kannst du mir auch bitte erklären warum? Nehmen die anderen Browser von Haus aus einen margin (z.b: 1 px, oder 0px) an und deshalb wirds auch nach links gezogen?

 

[Maik]

Die horizontale Ausrichtung text-align:center für das body-Element wird von den non-IE Browsers nicht auf die DIV-Box angewendet, deshalb auch die Lösung mit dem Aussenabstand:

div#inhalt
{
margin: 0 auto; /* Aussenabstand oben-unten = 0 / links-rechts = auto */
}

danke, das hat prima funktioniert.

Dann klicke bitte auf den 'Status-Button' deines Themas und markiere es so als 'erledigt', vielen Dank.

 

[Apfelkuchen]

Dann klicke bitte auf den 'Status-Button' deines Themas und markiere es so als 'erledigt', vielen Dank.

Ja, richtig. Sollte man nicht vergessen.

Danke