html - 在 <li> 上扩展背景图像

Question

我有一些无序列表，如果光标悬停在它上面，它会在 li 上显示一个背景图像:

<div class="sidebar">
    <ul>
        <li>test</li>
        <li>test</li>
        <li>test</li>
    </ul>   
</div>

和 CSS:

/* I DON'T HAVE STYLE FOR <UL> */
.sidebar li {
    list-style-type: none;
}
.sidebar li:hover {
    list-style-type: none;
    background-repeat: repeat-x;
    background-image: url(../img/mbg.png);
    color:white;
}

但它看起来像:

如何让背景一直延伸到左边尽头？谢谢!

Answer 1

也许你必须这样写:

.sidebar li{
margin:0;
pading-left:10px;
}

然后它的工作 检查这个http://jsfiddle.net/2thVU/