css - 将列表项中的文本顶部与背景图像对齐

Question

我正在尝试将左侧导航中的列表项中的文本设置为每个图像的顶部，无论是单行还是双行，但无法使其正常工作。

这是css和一个示例背景图像li：

.benefits li 
{font-size: 16px;
padding-left: 25px;
line-height: 2.1;
}

li.social {
background:url("/images/users.png") 0% 50% no-repeat;
}

非常感谢任何帮助。

Answer 1

将您的li标签 CSS 更新为：

url("/images/megaphone.png") 0% 0% no-repeat;

那将是 50% 到 0%。

或者，类似0.4em这样的图标与文本更好地对齐。

url("/images/megaphone.png") 0% .4em no-repeat;