li圖像未對齊

有沒有辦法將圖像移動到使用backgorund-image屬性的位置？我在CSS中有這個元素，你會從圖像中看到箭頭與文本不對齊。我需要將它們移下來？非常感謝li圖像未對齊

搶：

http://img143.imageshack.us/i/ie7listimage.png/

CSS

.footerTextContent 
    { 

      width:250px; 
      height:400px; 
      float:left; 
      font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; 
      font-size: 12px; 
      color: #fff; 
      font-weight: normal; 
      padding: 10px 0 0 28px; 
      list-style-image:url('../images/tick.png'); 
      line-height: 30px; 
      text-align:justify; 

    }

更新的代碼

HTML

<div class="footerTextContent"> 
      <ul> 

      <li><a href="#">Some domain</a></li> 
      <li>Some domain</li> 
      <li>Some domain</li> 
      <li>Some domain</li> 
      <li>Some domain</li> 
      </ul> 

     </div>

CSS

.footerTextContent 
    { 

      width:250px; 
      height:400px; 
      float:left; 
      font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; 
      font-size: 12px; 
      color: #fff; 
      font-weight: normal; 
      padding: 10px 0 0 28px; 
      line-height: 30px; 
      text-align:justify; 

    } 

.footerTextContent li 
    { 
      padding: 0 0 0 15px; 
      background-image:url(../images/tick.png); 
      background-position: left 7px; 
      background-repeat: no-repeat 



    }

來源

2011-06-22 bollo

代替使用

list-style-image:url('../images/tick.png');

的<ul>對<li>的圖像作爲背景圖像直接

.footerTextContent li { 
    background-image: url('../images/tick.png'); 
    background-repeat: no-repeat; 
    background-position: left 5px; 
}

您可以修改圖像的頂部位置爲您的需求。

來源

2011-06-22 14:15:42 DanielB

@丹尼爾我已經更新了我的代碼，但仍然沒有移動圖像。謝謝 – bollo

@bollo這絕對是要走的路。繼續玩後臺位置屬性，直到你得到你想要的。 – MrMisterMan

@bollo你也可以發佈一些HTML？我的CSS選擇器只是一個假設。請不要改變你的問題與答案的內容！我恢復了原來的問題。呦可能會添加額外的信息。 – DanielB

可以編輯圖形本身並添加它上面它的一些空白高度，否則，你將不得不自動換行的股利和使用類似

position:relative; 
top:-2px;

或

margin-top:-2px; 


<li>hello</li> //no good 
<li><div>hello</div></li> //better

來源

2011-06-22 14:11:05 maxp

無法編輯圖形，因爲它在8中看起來很好。它被封裝在我發佈的類中的div中。 .footerTextContent img將不起作用，因爲該圖像正在從課程中拉出。任何其他想法或我誤解了你的答案？謝謝 – bollo

回答

相關問題