リストの間隔の違いについてなのですが

質問

リストの間隔の違いについてなのですが

【　HTMLの記述　】
<ol>
<li>ほげほげ</li>
</ol>

【　CSSの記述　】
ol li {
list-style-position: inside;
}

上記の場合、それぞれのプラウザで以下のように違いが出てきます。

<IE6,IE7,Firefox3の場合>
1.　ほげほげ

<IE8の場合>
1.　　ほげほげ

これのIE8の間隔を狭めたいのですが可能なのでしょうか？
outsideは使わない方法でよろしくお願いします。

回答No.2

ORUKA1951 · ベストアンサー

おかしいですね。
前回のコメントの描画結果をあげておきます。

なお、list-style-position:outside;とした場合も、ほぼ同じ結果になるかな
<style type="text/css">
<!--
ol{
　margin-left: 10px;
　padding-left: 0px;
}
ol li {
　margin-left: 2em;
　padding-left: 0px;
　list-style-position:outside;
}
-->
</style>

回答No.1

ORUKA1951

質問では分かりにくいのですが、
★このシステムでは、連続した半角スペースはひとつになってしまう。
　必ず投稿前に表示を確認してね。

firefox
　　　1. １行目
　　　2. ２行目
IE(8)
1.　 １行目
2.　 ２行目
となることかな？
　これは、リストをどのようにレンダリングするかはユーザーエージェントに任せられていることによるものです。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
3つのリスト形式の実際のプレゼンテーションは、ユーザエージェント依存である。本仕様は、著者に、単にテキストの字下げ目的でリストを用いないよう求める。字下げはスタイル上の問題であり、スタイルシートによって適切に扱われる。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Lists in HTML documents (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/lists.html )］より

　具体的には、ol　ul　li のmargin,paddingをどのようにするかはユーザーエージェント次第だから、「スタイルシートによって適切に扱われ」なければならない。

　そこで、margin,paddingを具体的に指示してやれば良い。
ol{
margin-left: 10px;
padding-left: 0px;
}
ol li {
margin-left: 0px;
padding-left: 0px;
list-style-position:inside;
}

★こういうときは、ol{border:solid red;}　li{border:solid blue;}などと指定して、ブラウザがデフォルトでどのように解釈しているかチェックしながら作業すると早いよ。

お礼

回答ありがとうございます。

分かりにくかったようですみません。
表記の間違いではありません。

<IE6,IE7,Firefox3の場合>
1.　ほげほげ

<IE8の場合>
1.　　　ほげほげ

のようにリストマーカーと文字の間隔のことです。
※あと、実際にはmarginとpaddingを使用していますが、この「リストマーカーと文字の間隔」ではそれらは作用しないようなので省いています。

補足

間隔とは　"リストマーカーと文字の間隔"　のことです。