2012-07-06 9 views
5

イブリストの各テキストの行の左側に設定された背景画像 が並んでいるように見えますが、テキストの周りにスパンを入れて再配置しますテキストは、リボン内にスパンを配置

HTML ..

HERESにコードイム使用して動作するようには思えdidntは

<ul class="price-features"> 
<li><span>One page website with contact form</span></li> 
<li><span>Social Media Integration</span></li> 
<li><span>One year hosting + Domain registration</span></li> 
</ul> 

CSS

.price-features{ 
margin-top:30px; 
} 

.price-features li{ 
background-image:url(/images/prices/orange-arrow.png); 
background-repeat:no-repeat; 
background-position:left; 
padding-left:15px; 
height:30px; 
border-bottom:#999 1px solid; 
background-color:#996; 
} 

.price-features li span{ 
    padding-top:5px; 
} 

http://i.stack.imgur.com/rV1LM.png

答えて

6

パディングはブロックレベルの要素にのみ影響します。 spanをブロックレベルの要素に変更するか、デフォルトのdisplayblockまたはinline-blockに変更する必要があります。

.price-features li span{ 
    display: block; 
    padding-top:5px; 
} 
+0

素敵なもの、歓声 – Gezzamondo

関連する問題