如何将列表样式图标与文本对齐

Question

我正在为LI使用客户列表样式图像，我想在图标的中心排列文本。

我尝试过使用边距和填充无济于事。

请参阅下面的代码和截图

HTML：

<ul class="homeList">
 <li>Over 1 million happy travellers</li>
 <li>Over 450 local pick-up points with return travel for your convenience</li
 <li>Great range of breaks across Britain, Europe &amp; America</li>
 <li>Included excursion programmes</li>
 <li>Superb value assured</li>
</ul>

CSS：

.homeList li {
    list-style-image: url(../images/bulleticon.png);
    line-height: 20px;
    padding: 0;
    margin: 0;
}

这就是它目前的样子

Answer 1

而不是list-style-img使用background-image作为列表项。

li {
  list-style: none;
  background: url(../images/bulleticon.png) left center;
  padding-left: 20px;
}

您可以在更改背景位置属性时更改图像位置。