属性float使父元素忽略其高度

Question

我认为现场观看效果比在这里发布代码要好。所以你可以在这里找到它：jsfiddle

如您所见，“添加”按钮位于边框上。如果按钮没有浮动设置，一切都会很完美。一旦我设置浮动（无论是向左还是向右），盒子就不会扩展到应有的程度。

知道如何解决这个问题吗？谢谢。

Answer 1

将overflow: hidden添加到父元素 - http://jsfiddle.net/9GGTr/5/

Answer 2

您只需要使用clearfix或“clear：both”css样式清除浮动：

http://jsfiddle.net/BumbleB2na/9GGTr/6/

这会将浮动元素放回到页面的“常规流”中，允许其容器尊重浮动元素的宽度和高度。