图标(左)和文本(右)或左侧相反的文本和右侧图标的最佳方法是什么？
图标图像和文字的大小必须相同吗？理想情况下，我希望他们是不同的，但是在同一垂直方向。
我使用background-position css属性从更大的图像中获取图标。
这是现在我该怎么做，但我正在努力使他们在同一条线上或垂直对齐底部。
文本
这是我尝试你的建议后得到的。
虽然文本现在与图标对齐，但它叠加在我想要的图标右侧的图标上。请注意，我正在使用背景位置从更大的图像集中显示图标。
基本上我得到了
<icon><10px><text_and_unwanted_icon_to_the_right_under_it>
<span class="group3_drops_icon group3_l_icon" style="">50</span>
group3_drops_icon {
background-position:-50px -111px;
}
.group3_l_icon {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(/images/group3.png) no-repeat scroll left center;
height:35px;
overflow:hidden;
padding-left:55px;
}
解决方法
我通常使用背景：
<style type="text/css">
.icon {
background-image: url(path/to/my/icon.jpg);
background-position: left center;
background-repeat: no-repeat;
padding-left: 16px; /* Or size of icon + spacing */
}
</style>
<span class="icon">Some text here</span>
