Css 在图像和列表样式类型设置为“无”的列表项中缩进文本

我的问题有点类似于，但在无序列表的

li

s中有

img

下面是我的标记。（将其视为评论用户界面，如Facebook或G+，评论文本和用户档案图片缩略图并排显示）

我得到的结果如下：

因为很明显，当文本不适合宽度时，它会出现在我不想要的图像下方。如何使其保持对齐，而不是在缩略图下方流动

注意：

用于列表项的图像不打算用作

列表样式图像

，这是原型设计，每个

li

的图像会有所不同，您可以使用：

.comments
{
list-style-image:url('thumb.jpg');
}

---

如果每个li使用的缩略图不同

如果所有li的缩略图相同。这样做-

.comments li {
    background: url(thumb.jpg) no-repeat left top;
    padding: 0 0 10px 50px;
    font-size: 12px; min-height: 44px; /*thumb image height*/
}

---

是的，使用这种方法+1.您不希望图像是内联标记。使用背景或列表样式。我可以使用它，但这里不使用图像缩略图，因为

列表样式图像

@Dipaks您的否决票很小。如果它是动态生成的内容，CSS将几乎相同，只是变为内联的。@Baronth意味着更多的CSSClasses@Baronth如果你从CSS中调用图像，请使用miss SEO（alt/title属性）-读取所有li的缩略图是否相同？@Dipaks:不，我正在进行原型设计，每个

li

，它们都会不同。Fiddle正是我想要的解决方案，非常感谢！！

.comments
{
list-style-image:url('thumb.jpg');
}

.comments li {
    background: url(thumb.jpg) no-repeat left top;
    padding: 0 0 10px 50px;
    font-size: 12px; min-height: 44px; /*thumb image height*/
}