导航栏图标位置问题

Question

如何设置导航栏文字旁边的图标？

代码：

<ul>
    <li><a href="#" id="other-color" class="ui-btn ui-shadow ui-btn-icon-left ui-custom-icon ui-arrow ui-nodisc-icon">Set Filter</a></li>
    <li><a href="#" id="other-color" class="ui-btn ui-shadow ui-btn-icon-right ui-custom-icon ui-location ui-nodisc-icon">Add Page</a></
</ul>

CSS：

.ui-arrow:after {
    content: '';
    background-image: url(icons/filled-filter-32.png);
    background-size: 15px 15px;
}

.ui-location:after {
    content: '';
    background-image: url(img/plus-32.png);
    background-size: 15px 20px;
}

我需要这样，在文字之前和之后我都不需要空间。

Answer 1

在之前添加图片：

a.ui-arrow{ 
   display: inline-block;
   padding-left: 25px;
}

在以下后添加图片：

a.ui-location{ 
   display: inline-block;
   padding-right: 25px;
}

根据您的背景图片管理填充