0

私が達成しようとしているのはこの画像です:

ulリスト

今私がこれまでにしたことは次のとおりです。

<ul class="flechalista">
<li><a href="#">2012</a>
<ul class="flechalista">
     <li>Enero</li>
         <li>Febrero</li>
     <li>Marzo</li>
         <li>Abril</li>
</ul>   
</li>
</ul>

そして私のcssはこれです:

.flechalista{background:#fff;}
.flechalista li{background:#fff url(../img/red_arrow.png) no-repeat 10px 4px; padding:5px 0 5px 30px !important; border-bottom:1px solid #000;}

ご覧のとおり、border-bottomがすべてのliと全幅に対応していることを除いて、これは機能します。
パディングを減らして最初のLIを作成できたと思います(2012)。LIの数か月はもう少しパディングが多くなります。しかし、私がCSSで遊んでいるものを使用してそれを機能させる方法はありますか?

4

1 に答える 1

0
.flechalista{background:#fff;}
.flechalista li ul li{padding:5px 0 5px 50px !important; border-bottom:1px solid #000;}
.flechalista li a{padding:5px 0 5px 10px !important; display:block; width:100%; border-bottom:1px solid #000;}

</ p>

デモ: http: //jsfiddle.net/calder12/FSa2S/5/

于 2012-10-17T22:40:58.177 に答える