实现多个div并排显示,并间隔一定距离

学习记录:
实现多个div并排。需要使内层div宽度小于外层div,因为div默认独占一行,因此可设置浮动。
1、外层div宽度设置为100%;
2、内层div设置宽度小于外层div,并设置浮动:float:left;
3、增加div间距,margin-left:20px;

jsp:

<div class="main-content:>
	<div class ="main">
		1
	</div>
	
	<div class ="main">
		2
	</div>
</div>

css:

.main-content{
	width: 100%;
	height: 100%;
}
.main{
	width:260px;
	height:260px;
	float: left;
	margin-left: 20px;	
}

版权声明:本文为yxy0914原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。