老师 求指导
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<meta charset="utf-8"/>
<style>
*{margin:0; padding:0;}
.two,.three{
overflow: hidden;
zoom: 1;
padding: 20px;
}
.content{
float: left;
padding: 10px;
margin: 5px;
border: 1px solid gray;
}
.one{
width:50%;
text-align:center;
border: 1px gray dashed;
margin: 0 25% 0;}
</style>
</head>
<body>
<div class="one">
<div class="two">
<div class="content">
<img src="http://img1.sycdn.imooc.com\/climg/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习</p>
</div>
<div class="content">
<img src="http://img1.sycdn.imooc.com\/climg/590fe97d00011bda02400135.jpg"/>
<p>欢迎来到慕课网学习</p>
</div>
<div class="content">
<img src="http://img1.sycdn.imooc.com\/climg/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习</p>
</div>
</div>
<div class="three">
<div class="content">
<img src="http://img1.sycdn.imooc.com\/climg/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习</p>
</div>
<div class="content">
<img src="http://img1.sycdn.imooc.com\/climg/590fe97d00011bda02400135.jpg"/>
<p>欢迎来到慕课网学习</p>
</div>
<div class="content">
<img src="http://img1.sycdn.imooc.com\/climg/590fe982000150ba02400135.jpg"/>
<p>欢迎来到慕课网学习</p>
</div>
</div>
</div>
</body>
</html>
正在回答
同学你好，同学最外层父元素的宽度设置的不对，因为每一列的宽度为240(图片宽度)+20（左右padding）+2（左右边框）+ 10（左右margin）为272px，那么三列的宽度为816px，而two容器又设置了左右padding各20px，那么总的宽度就为816+40=856px，参考：
如果我的回答帮助了你，欢迎采纳，祝学习愉快~
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星