Problem IE <-> Mozilla und Co

Status
Nicht offen für weitere Antworten.

surrender

Mitglied
Guten Abend!

Mein Problem lässt sich am besten anhand zweier Bilder darstellen:

Aussehen soll das ganze so (tut es unter Opera, Mozilla und Co auch):
Mozilla.jpg


Unter IE aber so:
IE.jpg



Der Code sieht folgendermaßen aus:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>.:. surrenders Heimseite .:.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="black" Text="white">
<link rel="stylesheet" href="style.css" type="text/css">
  <div id="Layer1" style="margin: auto auto; width:482px; height:570px; z-index:1; background-image: url(background.jpg); layer-background-image: url(background.jpg); border: 1px none #000000;">
	<div style="margin: auto auto; width:482px; height:570px; z-index:1; background-image: url(background.jpg); layer-background-image: url(background.jpg); border: 1px none #000000;"></div>
</body>
</html>

Was muss man da ändern, um ihn IE schmackhaft zu machen, also für eine korrekte Darstellung zu sorgen?



Mit freundlichem Gruß,

Johannes
 
Zuletzt bearbeitet:
HI,

ich würde zunächstmal die DIV-Tags auch wieder schliessen (</div>) und dann mal ein "text-align:center" ins äussere DIV, oder ggf. ein "left:50%; margin-left:-divbreite/2" ins innere...

Gruß
.
 
Beide von dir vorgeschlagenen Dinge führen zu einer massiven Fehldarstellung (doppelt usw..)
Ich habe jetzt mal ein Div komplett weggelassen, das nicht benötigt wird.
Das Ganze sieht nun so aus:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>.:. surrenders Heimseite .:.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="black" Text="white">
<link rel="stylesheet" href="style.css" type="text/css"> 
	<div style="margin: auto auto; width:482px; height:570px; z-index:1; background-image: url(background.jpg); layer-background-image: url(background.jpg); border: 1px none #000000;"></div>
</body>
</html>

IE stellt es immer noch als linksbündig dar.
Kann es sein, dass IE margin: auto auto garnicht unterstützt?
 
Zuletzt bearbeitet:
surrender hat gesagt.:
Kann es sein, dass IE margin: auto auto garnicht unterstützt?
Korrekt. Um den DIV-Container zu zentrieren brauch Mozilla & Co "margin:auto" und der liebe IE brauch ein "text-align:center;" für den Body-Tag.
Damit dann dein Inhalt im DIV nicht zentriert ist, brauchen wir da wieder ein "text-align:left;".

mfg
sam

PS: Und wenn du grad dabei bist deinen Body-Tag per CSS zu verändern, kannst du auch gleich die Hintergrundfarbe und den Text per CSS einstellen...deine Methode ist schon ein wenig angestaubt ;)
 
Status
Nicht offen für weitere Antworten.
Zurück