nicht angemeldet
IE Bug mit Ordered Lists
Hallo Leute,
der IE hat es gerade geschafft, mich mit einem Bug der besonderen Art zu verblüffen. Sobald ich einer orderer list einen Breite verpasse, verschwindet die Numerierung. Bei mir allerdings nur im IE6, während ältere Versionen sich nicht so verhalten:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Listen im IE</title>
</head>
<body>
<ol style="width: 30em">
<li>Foo <span class="score">20 Punkte</span></li>
<li>Bar <span class="score">3 Punkte</span></li>
<li>Baz <span class="score">2 Punkte</span></li>
</ol>
</body>
</html>
Bei der Internetrechere kamen noch ganz andere Macken dieses Browsers mit Listen ans Licht. Die waren aber meist viel komplizierter als mein Bispiel.
Die einzige Lösung für mein Problem scheint bisher ein padding für die OL zu sein. Wirklich praktisch finde ich das aber nicht. Kann jemand mit einer Alternative dienen?
-
Hallo,
Die einzige Lösung für mein Problem scheint bisher ein padding für die OL zu sein.
Ja, genauer margin:0; padding:0; padding-left:2em; wobei die 2em variabel sind.
Wirklich praktisch finde ich das aber nicht.
Hm, wie willst Du sonst ein einigermaßen browserübergreifend funktionierendes Layout umsetzten, wenn Du _nicht_ _wenigstens_ margin und padding für alle Elemente explizit vorgibst.
Meist erledigen sich dadurch auch die weiteren Listen-"Bugs", von denen Du gelesen hast.
viele Grüße
Axel
-
Hallo Axel,
Die einzige Lösung für mein Problem scheint bisher ein padding für die OL zu sein.
Ja, genauer margin:0; padding:0; padding-left:2em; wobei die 2em variabel sind.
... Mit einem list-style-position:inside scheint's auch zu funktionieren, was jedoch die Listendarstellung grundlegend ändert.
Wirklich praktisch finde ich das aber nicht.
Hm, wie willst Du sonst ein einigermaßen browserübergreifend funktionierendes Layout umsetzten, wenn Du _nicht_ _wenigstens_ margin und padding für alle Elemente explizit vorgibst.
Es ging mir nicht darum, daß ich überhaupt kein padding/margin angeben möchte, sondern daß sich dieser Bug anscheinend nur mit padding für die OL beheben läßt. Das wird z.B. bei einer OL mit Hintergrundfarbe zum Problem, wenn ich den Rest des Listenlayouts nicht ebenfalls ändere. So wenig Änderungen pro Bugfix wie möglich wären mir am liebsten. Daher das "nicht wirklich praktisch".
Meist erledigen sich dadurch auch die weiteren Listen-"Bugs", von denen Du gelesen hast.
Mag schon sein. Aber mit denen hab ich ja gar nicht zu kämpfen, weil meine Liste viel einfacher gestrickt ist. ;-)
-
Hallo,
... Mit einem list-style-position:inside scheint's auch zu funktionieren, was jedoch die Listendarstellung grundlegend ändert.
Ja, eben deshalb gibt es meiner Meinung nach wenig sinnvolle Anwendungen für list-style-position:inside.
Hm, wie willst Du sonst ein einigermaßen browserübergreifend funktionierendes Layout umsetzten, wenn Du _nicht_ _wenigstens_ margin und padding für alle Elemente explizit vorgibst.
Es ging mir nicht darum, daß ich überhaupt kein padding/margin angeben möchte, sondern daß sich dieser Bug anscheinend nur mit padding für die OL beheben läßt. Das wird z.B. bei einer OL mit Hintergrundfarbe zum Problem, wenn ich den Rest des Listenlayouts nicht ebenfalls ändere.
Welche Probleme sollten das sein? Ein OL-Element mit
width:30em; margin:0; padding:0; padding-left:2em; background-color:#00AEAD;ist genau 32em breit und diese Breite wird auch von der Hintergrundfarbe ausgefüllt.viele Grüße
Axel
-
Hallo,
... Mit einem list-style-position:inside scheint's auch zu funktionieren, was jedoch die Listendarstellung grundlegend ändert.
Ja, eben deshalb gibt es meiner Meinung nach wenig sinnvolle Anwendungen für list-style-position:inside.
Hm, wie willst Du sonst ein einigermaßen browserübergreifend funktionierendes Layout umsetzten, wenn Du _nicht_ _wenigstens_ margin und padding für alle Elemente explizit vorgibst.
Es ging mir nicht darum, daß ich überhaupt kein padding/margin angeben möchte, sondern daß sich dieser Bug anscheinend nur mit padding für die OL beheben läßt. Das wird z.B. bei einer OL mit Hintergrundfarbe zum Problem, wenn ich den Rest des Listenlayouts nicht ebenfalls ändere.
Welche Probleme sollten das sein? Ein OL-Element mit
width:30em; margin:0; padding:0; padding-left:2em; background-color:#00AEAD;ist genau 32em breit und diese Breite wird auch von der Hintergrundfarbe ausgefüllt.viele Grüße
Axel
-
Es ging mir nicht darum, daß ich überhaupt kein padding/margin angeben möchte, sondern daß sich dieser Bug anscheinend nur mit padding für die OL beheben läßt. Das wird z.B. bei einer OL mit Hintergrundfarbe zum Problem, wenn ich den Rest des Listenlayouts nicht ebenfalls ändere.
Welche Probleme sollten das sein?
Tjo wenn du so fragst, weiß ich eigentlich auch nicht, worin ich gestern das Problem gesehen habe. ;-)
-
-
-