问CSS浮动导致背景图像显示不正确

EN

在Firebug / Firefox (您必须检查其他浏览器)中，我解决了您的问题，添加了一个：

li {
    overflow:hidden;
}

不知道到底为什么，但这条神奇的线解决了许多浮动的东西的问题:-)

编辑：解决方案，如果您可以稍微更改html

如果您可以控制html，您可以使用段落标记而不是列表项：

p.list_item {
    background: transparent url(/++resource++stylesheets/images/bullet.gif) no-repeat scroll left 0.45em;
    padding-left: 11px;
}

但是，这可能会改变列表项的语义...

这是一个古老的话题。但我想我应该加上我通常是如何做的，以防有人通过搜索在这里跌跌撞撞…

如果我在左边有一个图像，并计划在它的右边有图形项目符号无序列表(UL)，我将图像语句放在DIV标记中，并向该DIV添加一个float:left样式。

然后，我将UL标记包装在一个DIV中，并为该DIV赋予了一个float:left样式，使其出现在第一个DIV的右侧。

如果我有想要在UL下恢复的额外文本，那么我给第二个DIV一个宽度，它等于页面/列的总宽度减去图形宽度-基本上是考虑到图像右侧的所有空间。这将强制连续的文本直接在UL DIV下流动，如果UL比图形短，则文本将按照预期在图形的右侧流动，然后在图形的下方流动。

如果UL延伸低于图形，则文本将从图像下方开始，不出所料。

如果您希望文本在左侧图形下简单地开始，而不管UL的高度如何，那么您只需将clear:both样式应用于随后的

，即

一般来说，只要UL不比左边的图像高太多，这种方法就有效，因为很明显，在这种情况下，列表本身不会在图像下面换行，而是留出空格-因此，要使长长的列表向右看，可能需要一些有目的的图像大小调整，或者在第一个DIV中堆叠几个图像，或者其他任何您可能有的解决方案。

如果你真的想变得古怪，我有几次使用了上面描述的两个DIV方法，但将第一个DIV设置为position:relative，并将包含UL的第二个DIV放在第一个DIV中，其中包含一个position:absolute，当然还有top:??px和right:??px，当然，设置为将UL绝对定位到图像的右侧。使用这种方法需要正确的布局，显然...

好了，这就是我要说的，希望这是有意义的&祝任何人好运！

尝试将列表项包装在<p>标签中，然后为该标签留出左边距。