リストの入れ子について

初歩的な質問で済みません。次のようなリストにしたいのですがどの様なソースにすれば実現可能でしょうか？

１．項目
　・箇条書きＡＡＡＡＡ
　・箇条書きＢＢＢＢＢ
　・箇条書きＣＣＣＣＣ

２．項目
　・箇条書きＡＡＡＡＡ
　・箇条書きＢＢＢＢＢ
　・箇条書きＣＣＣＣＣ

↓これで良いのかと思ってるんですが「箇条書きＡＡＡＡＡ」等が大分右にずれてしまうんです。「箇条書き」のところをもう少し左にもってこれないでしょうか？


<ol>
<li>項目
<ul>
<li>箇条書きＡＡＡＡＡ</li>
<li>箇条書きＢＢＢＢＢ</li>
</ul>
</li>
<li>項目
<ul>
<li>箇条書きＡＡＡＡＡ</li>
<li>箇条書きＢＢＢＢＢ</li>
</ul>
</li>
</ol>

あと、「１．」と「項目」や「・」と「項目」の間隔は調整は可能でしょうか？

よろしくお願いします。

No.2 ベストアンサー 回答者： 345itati 回答日時： 2007/01/18 10:35

CSSで余白を調節

<style type="text/css">
<!--
.hidari {
margin-left: 0px;
padding-left: 0px;
}
-->
</style>
HTML部分
<ol>
<li>項目
<ul class="hidari">
<li>箇条書きＡＡＡＡＡ</li>
<li>箇条書きＢＢＢＢＢ</li>
</ul>
</li>
<li>項目
<ul>
<li>箇条書きＡＡＡＡＡ</li>
<li>箇条書きＢＢＢＢＢ</li>
</ul>
</li>
</ol>

マーカーの位置と基本ボックスの間隔を調節するにはmarker-offsetプロパティがありますが、残念ながらほとんどのブラウザが対応していないようです(使えないという意味
→http://www.nextindex.net/web/CSS/list.html

この回答へのお礼

345itatiさん、ありがとうございます。

早速試してみます！

お礼日時：2007/01/18 15:36

No.3 回答者： key-child 回答日時： 2007/01/18 22:20

li要素にpaddingを設定すれば調節できます。

<style type="text/css">
<!--

ul {
padding-left: 1em;
}
ul li {
padding-left: 2em;
}

-->
</style>

この回答へのお礼

key-childさん
ありがとうございます。

勉強になりました。

お礼日時：2007/04/01 07:05

No.1 回答者： dezimac 回答日時： 2007/01/18 10:23

見た目の調整はスタイルシートで行います。

例）上右下左の順番で、0,0,0,1文字の間隔を空ける
<style>
<!--
ol {padding: 0px 0px 0px 1em;}
ul {padding: 0px 0px 0px 1em;}
-->
</style>

http://www.tohoho-web.com/css/index.htm

>「１．」と「項目」や「・」と「項目」の間隔は
基本的に無理です。

この回答へのお礼

dezimacさん、ありがとうございます。

よく理解出来ました。

お礼日時：2007/01/18 15:27