css記述の再質問

質問

画像を添付します。
このようなことをcssでやりたいのですが。

回答No.2

amaryllis_watch

なるほど。
01からの連番でいくなら、先回に回答したcssの
.list:before {
content:"(" counter(list) ")";
}
を
.list:before {
content: "(" counter(list, decimal-leading-zero) ")";
}
に変更すれば(01)、(02)…になります。

補足

ありがとうございます。
下記のhtmlで行ったところ、テキストが折り返したときに、左括弧の頭で折り返します。
右括弧の次から折り返しをしたいんですが。

また、<p>タグで(2)を入力したとき、（1)と(2)の間が空いてしまいます。あかさないで続けることはできますか。

HTML
<div class="contents">
<ol>
<li>
<p class="list">テキストの折り返しテキストの折り返しテキストの折り返しテキストの折り返しテキストの折り返し</p>
<p class="list">テキストの折り返しテキストの折り返しテキストの折り返しテキストの折り返しテキストの折り返し</p>
</li>
<li>
<p>テキスト</p>
</li>
</ol>
</div>

CSS
.contents {
width : 600px;
counter-reset:list;
line-height: 1.5em;
}
.list {
counter-increment:list;
}
.list:before {
color:red;
content: "(" counter(list, decimal-leading-zero) ")";
}