当前位置: 代码迷 >> Web前端 >> 浮动后父级高度展示设置
  详细解决方案

浮动后父级高度展示设置

热度:248   发布时间:2012-06-28 15:20:03.0
浮动后父级高度显示设置
<html>
<head>
<style type="text/css">
#big{background:#f00;border:solid 20px #333;width:400px;overflow:hidden;height:aoto;}
#d1{height:500px;background:blue;float:left;width:400px;}
</style>
</head>
<body>
<div id="big">
<div id="d1">
</div>
<!--<div style="clear:both"></div>-->
</div>
</body>
</html>
浮动是脱离文档流的,这样的结果是父级显示区域不会包括浮动元素空间位,造成父级高度过小,解决办法可以在父级样式加"height:auto;overflow:hidden;或者浮动元素下加<div style="clear:both"></div>"
  相关解决方案