WinIEで、list要素(ul,ol,li)にwidthを指定すると色々おかしい

WinIE6で幅(width)指定したリスト要素(ul・ol)のマークが消えるバグと、回避策 - Web & Design Creation notes+++
上記記事が中途半端だったので、もう少し内容を加えて詳しく書こうと思います。
WinIE6,7,8で、list要素(ul,ol,li)にCSSのwidthプロパティを設定すると、レンダリングがおかしくなります。
WinIE6,7は互換モード・標準モードどちらも、WinIE8は互換モードでキャプチャのような表示になります。

ul
ol

HTML(ul)

<ul>
<li>CSS<br>指定なし</li>
<li>CSS<br>指定なし</li>
</ul>

<ul style="width:50%;">
<li>ulに<br>width:50%;</li>
<li>ulに<br>width:50%;</li>
</ul>

<ul>
<li style="width:50%;">liに<br>width:50%;</li>
<li style="width:50%;">liに<br>width:50%;</li>
</ul>

HTML(ol)

<ol>
<li>CSS<br>指定なし</li>
<li>CSS<br>指定なし</li>
</ol>

<ol style="width:50%;">
<li>olに<br>width:50%;</li>
<li>olに<br>width:50%;</li>
</ol>

<ol>
<li style="width:50%;">liに<br>width:50%;</li>
<li style="width:50%;">liに<br>width:50%;</li>
</ol>

ul,olにwidthを設定すると、リストマークが消える

前記の例の、2番目のリストの状態です。

回避策
  1. ul,olにlist-style-position:inside;を適用
  2. liにtext-indentとpaddingで字下げ
  3. ul,olにmargin-leftで横位置調整
<ul style="width:50%;list-style-position:inside;margin-left:1.5em;">
<li style="padding-left:1em;text-indent:-1em;">ulに<br>width:50%;</li>
<li style="padding-left:1em;text-indent:-1em;">ulに<br>width:50%;</li>
</ul>

liにwidthを設定すると、リストマークが下にずれる

前記の例の、一番下のリストの状態です。

回避策
  1. liにvertical-align:top;を適用

※ただし、ulの場合は、デフォルトのマークの位置より上になってしまう。こちらの回避策は不明。。。

<ul>
<li style="width:50%;vertical-align:top;">liに<br>width:50%;</li>
<li style="width:50%;vertical-align:top;">liに<br>width:50%;</li>
</ul>

olのliにwidthを設定すると、リスト番号がすべて1.になってしまう

前記の例の、olのキャプチャの、一番下のリストの状態です。

回避策
  1. liにdisplay:list-item;を適用
<ol>
<li style="width:50%;vertical-align:top;display:list-item;">liに<br>width:50%;</li>
<li style="width:50%;vertical-align:top;display:list-item;">liに<br>width:50%;</li>
</ol>