Как сделать CSS background-position с отрицательным левым значением видимой?

Question

У меня есть элемент <ul> с list-style:none; и <li> с padding:20px; и background-image:url(images/bullet.gif) no-repeat -20px 10px;.

Пуля не видна. Обходной путь, который я сейчас использую, равен 0 вместо -20px для фона и для элемента <li> position:relative;padding-left:20px;margin-left:-20px;.

.

Есть ли лучший способ сделать это?

РЕДАКТИРОВАТЬ: Мне нужно, чтобы пуля находилась за пределами поля <ul>. Это является причиной использования отрицательной маржи.

Спасибо.

Answer 1

Вот пример jsfiddle.http://jsfiddle.net/jesseatkinson/z2qss/. Ваш CSS должен выглядеть следующим образом.

ul li {
    background: url(../bullet.gif) left center no-repeat transparent;
    padding-left: 40px;
    list-style: none; 
}

Answer 2

Попробуйте этот пример:

http://jsfiddle.net/sC8BR/2/