css - CSS中的DIV宽度 float 问题

Question

我有一个关于 float div 的问题。我想将所有 div 设置为 float:left 并将它们全部显示在屏幕的同一行上:

Example
A - div a "style=float:left"
B - div b "style=float:left"
C - div c "style=float:left"

As appeared on screen:

A  |  B  |   C


However, when contents in C is overflowing, it end up in the next row like this

A   |   B
C

我可以知道如何让 div C 回到与 div A 和 B 相同的行，而不管 C 中的内容有多大吗？我知道 C 在下一行，因为宽度比上一行可以包含的宽度宽。我们如何使div C 与A 和B 显示为同一行，而不管C 中的内容有多大？就我而言，div C 没有固定宽度，我也不打算设置最大宽度。但是 A 和 B 有固定的宽度。

谢谢。

Answer 1

如果 C 没有固定的 with，你不能仅仅通过使用 float 来做到这一点。但是，您应该能够通过不在 C 上设置 float 并给它一个等于 A + B 的宽度的 margin-left 来完成您想要的。

通过为 C 提供左边距，它将出现在 A 和 B 的右侧(因为那里有可用空间)，并且由于您没有为其分配任何宽度，它将占据剩余空间。作为奖励，如果 C 比 A 和 B 高，它不会将内容移动到其他框下方。