Liste im IE6 zentrieren
Max M.
- css
Hallo,
ich habe eine Liste erstellt und möchte diese zentrieren. Dazu verwende ich folgenden Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Zentrierte Liste</title>
<style type="text/css">
ul {
display:table;
margin:auto;
}
li {
float: left;
list-style: none;
}
</style>
</head>
<body>
<div class="main">
<ul>
<li>Elem1</li>
<li>Elem2</li>
</ul>
</div>
</body>
</html>
Im FF, Opera, Safari, IE8 wird die Liste auch auf der Seite zentriert ausgerichtet. Leider macht mir der IE6 und IE7 probleme. In beiden Browsern wird die Liste links ausgerichtet. Was muss ich für diese Browser beachten, dass die Listenlemente zentriert werden?
Im FF, Opera, Safari, IE8 wird die Liste auch auf der Seite zentriert ausgerichtet. Leider macht mir der IE6 und IE7 probleme. In beiden Browsern wird die Liste links ausgerichtet. Was muss ich für diese Browser beachten, dass die Listenlemente zentriert werden?
Warum erhält ul "display: table"? Afaik unterstützten alte IEs diesen Wert für die display-Eigenschaft noch nicht.
Hallo suit,
da hast Du natürlich recht. Ein weiterer Versuch die Elemente zu zentrieren ist folgender:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Zentrierte Liste</title>
<style type="text/css">
li {
float: left;
list-style: none;
}
</style>
</head>
<body>
<table width="100%" height="100%"><tbody><tr><td align="center">
<ul style="text-align: center;">
<li>Elem1</li>
<li>Elem2</li>
</ul>
</td></tr></tbody></table>
</body>
</html>
Dieser Versuch funktioniert leider in keinem Browser. Wie bekomme ich die Elemente zentriert (ohne das "li{float:left}" gelöscht wird)?
da hast Du natürlich recht. Ein weiterer Versuch die Elemente zu zentrieren ist folgender:
Wo kommt jetzt die Tabelle her und wozu ist diese gut?
Dieser Versuch funktioniert leider in keinem Browser. Wie bekomme ich die Elemente zentriert (ohne das "li{float:left}" gelöscht wird)?
überhaupt nicht™
text-align hat keine Auswirkung auf Elemente die in irgend einer Form eine block box erzeugen.
Ggf. ist inline-block dein Freund.
Mahlzeit Max M.,
Dieser Versuch funktioniert leider in keinem Browser.
Und das ist auch gut so:
MfG,
EKKi