软件开发的家园,编程爱好者的天地.

现在是:北京时间 2016/4/14 上午11:50:51 星期四

设为首页  |  加入收藏  |  网站地图

CSS子元素浮动,父元素包不住子元素
发布于:第八基地 来源:第八基地 作者:天堂路上 时间:2016-09-05 点击:1841
<!DOCTYPE html>
<head>
	<style>
		.clearfix {
			display: block;
			float: none;
			clear: both;
			overflow: hidden;
			width: auto;
			height: 0;
			margin: 0 auto;
			padding: 0;
			font-size: 0;
			line-height: 0;
		}
		</style>

	</head>

	<body>
	<pre>
		当子元素浮动的情况下,父元素默认是包不住子元素的,解决办法
		1、在最后一个子元素的后面(父元素里面)加一个清浮动的元素
		2、给父元素加overflow:hidden;
	</pre>
	<div class="main" style="width:500px;border:1px red solid;margin:0 auto;">
		<div style="float:left;border:1px blue solid;">
			第一个内部DIV,左浮动
		</div>
		<div style="float:right;border:1px yellow solid;">
			第二个DIV,右浮动
		</div>
		<div class="clearfix"></div>
	</div>
	</body>
	</html>
对我有帮助
(0)
0%
对我没帮助
(0)
0%
返回顶部
在线反馈
在线反馈