在不影響背景的情況下移動對象的位置

目標：
將圖標的對象和文本「bbb」移動到右側約10個像素。背景應該保持在同一個位置。在不影響背景的情況下移動對象的位置

問題：
我試圖做到這一點，但我失敗了。抱歉!

謝謝！

#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; 
 
}

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

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

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

來源

2015-11-05 What' sUP

你想AAA和BBB看起來相似？左邊是文字，右邊是圖標？ – AtheistP3ace

你的意思是：https://jsfiddle.net/5f7qjLgf/8/ ??編輯：我剛剛作爲答案 –

可能的重複[使文本「bbb」旁邊的圖標，而不是拼合在一起]（http://stackoverflow.com/questions/33547457/make-the- text-bbb-to-the-icon-not-flatten-together） – Alex

只是改變這個CSS：

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

因此，在a標記的右側減少10px，向左移動10px（移動「bbb」和background-position:10px，以便將圖標10pc移動到右側。

FIDDLE

來源

2015-11-05 15:45:40

謝謝你的幫助！ –

在不影響背景的情況下移動對象的位置

回答

相關問題