清除浮动到内容边缘 [英] clearing floats to content edge
问题描述
是否有一种CSS方法来清除浮动，使其与
左边的内容边缘对齐。
例如：
XXX
XXX
XX
X
XO
XO
X浮子是前3个浮子，而O是浮子。是最后的
我想要O浮动以清除其他三个，并出现在
下的X彩车。宽度是动态的，所以我不能使用clear：left。
，即可能存在任意的X。浮点数和高度。
遗憾的是内联块没有得到很好的支持，所以这不是
选项
任何想法？
谢谢
Hi,
Is there a CSS method to clear a float such that it aligns with the
left content edge.
For example:
X X X
X X X
X X
X
X O
X O
The "X" floats are the first 3 floats, and the "O" is the last
I would like the "O" float to clear the other three, and appear under
the "X" floats. The width is dynamic, so I can''t use "clear : left".
i.e. there could be arbitrary "X" floats and heights.
unfortunately inline-blocks aren''t well supported, so that isn''t an
option either
any ideas?
thank you
推荐答案
2007年-03-13，yb< ba ********* @ yahoo.cawrote：
On 2007-03-13, yb <ba*********@yahoo.cawrote:
是否有CSS方法来清除浮动，使其与
左边内容边缘对齐。
例如：
XXX
XXX
XX
X
XO
XO
X浮子是前3个浮子，而O是浮子。是最后的
我想要O浮动以清除其他三个，并出现在
下的X彩车。宽度是动态的，所以我不能使用clear：left。
，即可能存在任意的X。浮点数和高度。
遗憾的是内联块没有得到很好的支持，所以这不是
选项
任何想法？
Hi,
Is there a CSS method to clear a float such that it aligns with the
left content edge.
For example:
X X X
X X X
X X
X
X O
X O
The "X" floats are the first 3 floats, and the "O" is the last
I would like the "O" float to clear the other three, and appear under
the "X" floats. The width is dynamic, so I can''t use "clear : left".
i.e. there could be arbitrary "X" floats and heights.
unfortunately inline-blocks aren''t well supported, so that isn''t an
option either
any ideas?
您可以尝试嵌套花车，所以
XX
XX
X
O
O
全部放入一个新浮子，它本身包含两个X浮子和
O浮动，O浮动上设置清晰。
请记住：没有问题无法通过其他级别解决
$ b嵌套$ b（旧编程谚语的变体）。
You could try nesting the floats, so
X X
X X
X
O
O
is all put into a new float which itself contains the two X floats and
the O float with clear set on the O float.
Remember: there is no problem that cannot be solved with another level
of nesting (variant of old programming proverb).
yb写道：
yb wrote:
>
是否有一种CSS方法来清除浮点数，使其与
左边内容边缘对齐。
>
Is there a CSS method to clear a float such that it aligns with the
left content edge.
为什么，是的。
clear：left;
;）
-
Berg
Why, yes.
clear:left;
;)
--
Berg
为什么，是的。
Why, yes.
>
clear：left;
>
clear:left;
我希望它是这么容易:)我不得不说我对问题的解释
太可怕了，请看这里的例子：
http://www.yasweb.com/ie_solution.html
调整大小时窗口，注意块是怎样的。 （它们是内联 -
块）流程就像它们是内联元素一样，
它们也使用了veritcal-align top。 （我需要一个解决方案，
可以使用任意数量的块，链接
只是一个典型的例子，它们将基于用户生成
搜索映射到产品匹配）
我试图在firefox中模拟相同的效果，但它没有
支持内联 - 阻止:(。
我试过向左浮动，但由于积木的高度不同，我不能在一条线上清除它们。
谢谢
I wish it were so easy :) I have to say my explanation of the problem
was terrible, please see the example here:
http://www.yasweb.com/ie_solution.html
When resizing the window, notice how the "blocks" (they are inline-
blocks) flow as if they are inline elements,
they are also using veritcal-align top. (I need a solution that will
work with an arbitrary number of blocks, the link
is just a typical example, they will be generated based from user
searches mapping to product matches)
I''ve tried to emulate the same effect in firefox, but it does not
support inline-block :(.
I tried float left, but since the blocks are varying heights, I can''t
clear them all on a line.
Thank you
这篇关于清除浮动到内容边缘的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
