解决子级css float 浮动而父级高度没有自适应导致子级溢出父级的问题

出现问题的代码：

代码语言：javascript复制

.divcss5{
    width:500px; 
    border:1px solid #000; 
    padding:10px
} 
.divcss5-lf{ 
    float:left; 
    width:220px; 
    height:100px; 
    background:#000
} 
.divcss5-rt{ 
    float:right; width:230px; 
    height:100px; 
    background:#06F
} 

代码语言：javascript复制

<div class="divcss5"> 
    <div class="divcss5-lf"></div> 
    <div class="divcss5-rt"></div> 
</div> 

Paste_Image.png

解决方法：

使用clear

代码语言：javascript复制

.clear{ 
    clear:both
} 

代码语言：javascript复制

<div class="divcss5"> 
    <div class="divcss5-lf"></div> 
    <div class="divcss5-rt"></div> 
    <div class="clear"></div>
</div> 

效果如下：

Paste_Image.png

image paste png

1 人点赞