移动物体＆＃39;位置不影响背景

Question

目标：
移动图标的对象和文本＆＃34; bbb＆＃34;到右侧，大约10个像素。背景应保持在同一位置。

问题：
我试着这样做，但我失败了。抱歉!

谢谢！

＆＃13;

＆＃13;

#result-filters {
    margin: 20px, 20px, 30px;
}
#result-filters UL {
    display: inline;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    font-size: 12px;
    font-family: arial, helvetica, sans-serif;
}

#result-filters UL LI {
    margin: 0 8px 0 0;
    float: left;
}


LI.filtered A {
    position: relative;
    padding: 1px 20px 1px 4px;
    background: #F0F0FF url(https://cdn3.iconfinder.com/data/icons/luchesa-vol-9/128/Lollipop-16.png) no-repeat scroll right 0;
    background-position: right bottom;
    font-weight: 400;
    color: #08C;
    text-decoration: none;
}

LI.filtered, #result-filters LI.filtered {
    padding-left: 0;
    background: transparent none repeat scroll 0 0;
}

li.ttt a
{
    position: relative;
    padding: 1px 40px 1px 20px;
    background: #F0F0FF url(https://cdn3.iconfinder.com/data/icons/luchesa-vol-9/128/Lollipop-16.png) no-repeat scroll left 0;
    background-position: left;
    font-weight: 400;
    color: #08C;
    text-decoration: none;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background-color: #F4F4F4;       
    font-size: 18px;
}

＆＃13;

<div id="result-filters">
    <ul>
        <li class="filtered"><a href="">
		aaa
		</a>

        </li>
        <li class="ttt"><a href="">bbb</a>
        </li>
    </ul>
</div>

＆＃13;

＆＃13;

＆＃13;

  

https://jsfiddle.net/5f7qjLgf/7/

Answer 1

只需更改此css：

li.ttt a {
    padding: 1px 30px 1px 30px;    
    background-position: 10px ;
}

所以，距离a标签右侧10px，向左侧多10px（移动“bbb”和background-position:10px，因此您将图标10pc向右移动。

<强> FIDDLE