float的疑点记录

如何让个父级元素包住两个左右浮动的子元素？

html代码：

    
child1
    
child2

CSS代码：

效果如图：

float

接下来只要把.parent:after元素边框和高度都去掉就可以了，这样的话child1和child2在父级元素里左右浮动，而中间不会有其它的东西了。这是用float布局的常见套路。

float相关注意点

• clear:left; 我的左边不能有浮动元素；
• clear:right; 我的右边不能有浮动元素；
• clear:both; 我的两边不能有浮动元素；
• 父级元素的高度是由处于常规流中元素的高度决定的。
• after/before插入的内容依然是在父级元素里，只是在父级元素内容的前后而已。