Reinhold: Zentriert in IE8 linksverschoben in IE7 und IE9

Beitrag lesen

SELF-Forum

Zentriert in IE8 linksverschoben in IE7 und IE9

Reinhold
– Informationen zu den Bewertungsregeln

Hallo,

die Sache stellt sich jetzt etwas anders da, IE8 war korekt und IE7 und IE9 nicht.
Im folgenden Beispiel ist der Text in der ersten Ausgabezeile zentriert in Firefox und IE8 aber zu weit links in IE7 und IE9.
Das Beispiel wurde sehr vereinfacht. In der Realität sind in den divs Texte und Bilder.
Je nach Situation sollen bestimmte divs ausgeblendet werden (im Beispiel div.td4).
Es ist auch tatsächlich nicht sichtbar, aber der Platz bleibt wohl reserviert, weswegen der Text nach links rutscht. Wie kann ich das korrigieren?

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>T E S T</title>  
<style type="text/css">  
div.table  
{  
    display: table;  
    margin-left: auto;  
    margin-right: auto;  
}  
  
div.tr  
{  
    display:table-row;  
}  
  
div.td1, div.td2, div.td3, div.td4  
{  
    display:table-cell;  
}  
  
 /* IE 7 */  
* + html div.table {  
    text-align:center;  
}  
  
* + html div.td1, * + html div.td2, * + html div.td3, * + html div.td4 {  
	display: inline;  
	padding: 5px;  
}  
  
  
div.td4 {  
    display: none;  
    visibility: hidden;  
}  
  
#TestMitte {  
    text-align: center;  
}  
  
</style>  
  
</head>  
<body>  
    <div class="table">  
      <div class="tr">  
        <div class="td1">a</div>  
        <div class="td2">bbbbbb</div>  
        <div class="td3">c</div>  
        <div class="td4">ddddd</div>  
      </div>  
    </div>  
<div id="TestMitte">  
<h2>|   Mitte der Seite   |</h2>  
</div>  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln