1

在屏幕截图中，您会看到左侧的项目列表（未浮动）和右侧的显示框（浮动）。如何防止左侧项目的 li 元素切入显示框。li 内容遵循流程并在运行到显示框之前换行，但 li 元素与容器中一样，不会。

左 div 切入右 div

左边的李项目：

border: 1px solid #000000;
display: block;
margin-bottom: 8px;
padding: 10px;

右侧显示框：

border: 3px double #000000;
display: inline-block;
float: right;
margin-left: 20px;
padding: 15px;
width: auto;

谢谢，瑞安

根据罗伯特的建议：

将 inline-block 添加到 li 元素

对 TIM B 的回应

宽度在不同的页面上是动态的，在每页中是动态的，但是它们不会在每页的基础上改变，除了超出显示框的 li 元素。就像当您将图片浮动到左侧并且文本位于图片的右侧时一样，但是一旦图片结束，文本就会一直在图像下方一直延伸到页面的右边缘，这就是我想要的反向. 所以我想让 li 元素走到右边显示框的左边缘，但是过了那个框，我想走到页面的边缘。文字本身符合这一点，但是由于某种原因，li 元素并没有识别出有一个“对象”，以防止它停下来切入显示框。它不识别的原因是因为右边的浮动显示框，

4

3 回答 3

0

由于文本正在执行您想要的操作，而不是包含它的 LI，因此我认为 LI 正在呈现为块级元素 (http://htmlhelp.com/reference/html40/block.html)。尝试将其设置为 display:inline-block。

于 2012-07-23T20:37:00.207 回答
0

如果您浮动一个元素而不是其他元素，那么您将遇到这些问题。尝试浮动 ul 元素并给出项目宽度。

于 2010-09-20T22:30:40.437 回答
0

如果您知道右侧列的最大宽度是多少，您可以添加 margin-right:00px; 到列表项或列表本身。

于 2010-09-21T08:34:57.310 回答