Home > Windows > Internet Explorer > ver.6 パディング・幅・高さを指定したリストでリストマーカーが壊れる

パディング・幅・高さを指定したリストでリストマーカーが壊れる

リスト要素に上パディング、リストアイテム要素にwidthまたはheightプロパティを指定したとき、最初のリストアイテムのリストマーカーが消える。

順序つきリストのリストアイテム要素にwidthまたはheightプロパティを指定したとき、2番目以降のリストアイテムの番号がすべて1番目を表すものになる。

Category: Internet Explorer, Windows, ver.6
Tag: padding, リストマーク

例示

<ul style="padding-top:1px;">
    <li style="width:90%;">1番</li>
    <li style="width:90%;">2番</li>
    <li style="width:90%;">3番</li>
</ul>
<ol style="padding-top:1px;">
    <li style="width:90%;">1番</li>
    <li style="width:90%;">2番</li>
    <li style="width:90%;">3番</li>
</ol>

1番
2番
3番

1番
2番
3番

前者のリストは1つ目の不具合を、後者のリストは2つの不具合を両方とも発生させています。

スクリーンショット

Ns7.1 Netscape7.1標準モード

WinIE6.0標準モード

補足

li要素以外の要素でdisplayプロパティにlist-item値を明示することで生成したリストアイテム要素で、2番目の不具合は発生しません。

<div style="padding:0 0 0 2em;">
    <div style="display:list-item; list-style-type:decimal; width:90%;">1番</div>
    <div style="display:list-item; list-style-type:decimal; width:90%;">2番</div>
    <div style="display:list-item; list-style-type:decimal; width:90%;">3番</div>
</div>

1番

2番

3番