背景圖像至低於李標籤

上述移動在圖像中，我在氣泡格式顯示新聞項。這些都是在一個列表，像這樣：

<ul> 
    <li> 
     <h2>South West Training Association</h2> 
     <p>South West Training Association to get online makeover ....</p> 
     <a href="#"><img src="images/readmore.jpg" alt="Read More" width="72" height="22" border="0" /></a> 
    </li> 
</ul>

ul{ list-style-type:none;} 
ul h2{color:#01558a; text-decoration:none; font-size:90%; font-weight:bold; font-style:normal;} 
ul p{font-size:.7em; font-style:italic; line-height:1.1em; padding:4px 0; margin:0;} 
ul li{background:#f8f5d4 url(../images/news-li-bottom.jpg) no-repeat left bottom; border:#ebe6b3 2px solid; padding:8px; -moz-border-radius: 6px;-webkit-border-radius: 6px;border-radius: 6px;behavior: url(border-radius.htc); margin:0 0 20px 0; display:block;}

的CSS生成一個圓角的盒子的新聞項目。我想將下面的箭頭放在列表項背景中提到的位置。現在我想將它移動到底部20px以下。我怎樣才能做到這一點？

來源

2011-05-20 themajiks

這裏是小提琴.. http://jsfiddle.net/themajiks/FBWCM/ – themajiks 2011-05-20 06:47:01

你可以做這樣的事情：

ul li:after { 
    content: url(lien vers ton image); 
    position: absolute; 
}

，然後使用底部：左：倒positionner噸圖像AU博訥endroit。

它不適用於所有瀏覽器。爲了確保你應該在你的li中添加一個span，把背景放在它的位置上。

來源

2011-05-20 07:00:22 lipelip

是的。你是對的。但當我的位置：相對李和位置：絕對的跨度，背景隱藏在即。 – themajiks 2011-05-20 07:34:10

這很奇怪，不要忘記將span放在display：block中，並將圖片的尺寸用於寬度和高度。底部應該等於圖片的負高度。 – lipelip 2011-05-20 07:38:33

是的。當然。做到了。但仍然不會在ie中工作。 li的背景顏色消失。 – themajiks 2011-05-20 07:49:32

背景圖像至低於李標籤

回答

相關問題