5

我想使用外部列表属性将 ul 列表正确定位在左浮动 img 的右侧,但项目符号未在图像右侧对齐,因为没有任何图像,但左侧更多.

<img style="float: left; margin-right: 0.1em;" src="http://commons.cathopedia.org/w/images/commons/thumb/f/fe/Carnevale_di_Venezia.JPG/250px-Carnevale_di_Venezia.JPG" />
<ul>
    <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
    <li>Lorem ipsum dolor sit amet, cnsectetur cnsecteturcnsectetur um dolor sit amet, consectetur adipiscing elit</li>
</ul>

请参阅小提琴以获得更好的理解。

我不能修改html,只能修改css。

我不想将列表属性放在里面。

如果我为图像添加右边距,非 ul 文本也会移动,我不想要它。

如果我为 ul 或 li 添加左边距或填充,不在图像右侧的列表也会向内移动,我不想要它。

我该如何管理它?

4

2 回答 2

9

您可以尝试添加隐藏在 ul 标记http://jsfiddle.net/2z6Zn/61/中的溢出:

ul {
    padding-left: 1.2em;
    overflow: hidden;
}​
于 2012-10-23T19:10:07.977 回答
1

演示

是你要找的吗?我不确定....如果您需要添加更多内容,请检查并解释更多...

img {
    float: left;
    margin-right: 1.9em;
     position: relative;
}

li {
    list-style-position: outside;
}
ul {
    padding-left: 1.2em;
}​
于 2012-10-23T14:11:51.100 回答