Darstellungsproblem im ie

Hallo,

ich hoffe die Kategorie ist richtig.

Ich hab ein Problem mit der Darstellung meiner Typo3 4.3 site im IE.

Beim Opera und Firefox wird es richtig angezeigt, nur der ie mag nicht so.

Dabei ist es Egal ob IE 6,7 oder 8

Link zur Typo installation

http://weckheuer-motorsport.de/typo43/index.php

So soll es ausschauen:

Bild: weckheuer-motorsport.de/…/richtig.JPG

so sieht es im ie 6 aus

Bild: weckheuer-motorsport.de/…/falsch.JPG

In der HTML Vorlage sieht es auch im ie richtig aus.

hier noch mein css:

body {
background: #bcbdbe url(images/background.png) repeat-x;
width: 993px;
text-align: left;
margin: 0px;
font-family: Verdana, Arial;
color:#5969a5;
}
a
div#menu {
position:absolute;
top:208px;
left:13px;
width:701px;
height:30px;
z-index:1;
text-align: center;
color:#FFFFFF;
font-size:15px;
font-weight: bold;
}

div#termin {
position:absolute;
top:20px;
left:726px;
width:257px;
height:188px;
z-index:1;

}

div#header {
position:absolute;
top:20px;
left:13px;
width:701px;
height:188px;
z-index:1;
background-image:url(images/header.gif);
background-color: transparent;
width: 699px;
height:179px;
}

div#top {

background-image:url(images/top.gif);
background-color: transparent;
background-repeat:no-repeat;

width: 993px;
height:250px;
text-align:center;
font-size:20px;
}

div#content {
background-image:url(images/content.gif);
background-repeat:repeat-y;
background-color: transparent;
padding-right: 300px;
padding-left: 20px;
text-align: left;
}

div#bottom {
background-image:url(images/bottom.gif);
background-color: transparent;
background-repeat:no-repeat;
width: 993px;
height:34px;
}

div#sponsor {
position:absolute;
top:230px;
left:726px;
width:257px;
height:500px;
z-index:1;
}

div#footer {
text-align: center;
font-size: 16px;
}

h1 {
font-weight: normal;
font-size: 20px;
line-height: 12px;
font-family: Verdana, Arial;
margin:0px;
padding:0px;
font-weight: bold;
}

c1 {
font-weight: normal;
font-size: 12px;
line-height: 12px;
font-family: Verdana, Arial;
margin:0px;
padding:0px;
font-weight: bold;
}

a.linkWeiss{
text-decoration:none;
color:white;
}

a:hover.linkWeiss{
text-decoration:underline;
}

.red {
color:#FF0000;
}

Hat da vielleicht jemand eine Idee?

Danke und Gruß

Marcel

Da Du die IEs in den Quirks-Mode zwingst (durch den DOCTYPE), wirkt text-align: center auch auf die Elementen und nicht nur auf den Text.

Hallo Emil,

danke, wie kann ich das denn nun umgehen?

mweckheuer schrieb

danke, wie kann ich das denn nun umgehen?

Den passenden DOCTYPE setzen. Mehr dazu findest Du, wenn Du nach "Quirks-Mode" und "DOCTYPE" suchst.

Ah dankeschön

klappt nun 🙂

Musste den xml teil für den ie abschalten

[browser = msie]
config.xmlprologue = none
[global]

Da war aber kein xml-Prologue (zumindest für die IEs).
Jetzt hast Du einen geeigneten DOCTYPE - daher klappt es auch.
Theoretisch hätte es auch gereicht, "text-align: center" zu entfernen. Den richtigen DOCTYPE sollte man aber trotzdem setzen.

Nur der Doctype alleine hatte das Problem nicht gelöst.

Erst durch das Abschalten des xml-Prologue konnte ich es beheben.

Habe eben im Cache nachgeschaut - es war kein xml-Prolog da, für keinen Browser.
Wenn Du allerdings "doctype = xhtml_strict" in Deinem TypoScript schreibst - wird auch der xml-Prolog generiert.
Wenn Du magst, kannst Du

config.xmlprologue = none

nur auf die alten IEs anwenden:

[browser = msie]&&[version= <7]
config.xmlprologue = none
[global]

Übrigens: ohne das (für meine Begriffe unnötige) Text-Zentrieren bei den IEs, würde es auch mit xml-Prolog funktionieren. Wo kommt dieses "text-align: center" überhaupt her. Soll das Dein Layout in IE 5.x zentrieren? Wenn ja - warum nicht in allen Browser?