是这样写吗？没搞明白为啥。但是能胡乱写出来。。。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin:0;
padding:0;
}
div.con{
height: auto;
padding:0 200px 0 200px;
overflow: hidden;
}
.min,.left,.right{
position: relative;
float: left;
}
div.min{
width: 100%;
height: 100px;
background: red;
}
div.left{
width: 200px;
height: 100px;
background: yellow;
margin-left: -100%;
left:-200px;
}
div.right{
width: 200px;
height: 100px;
background: green;
margin-left: -200px;
right: -200px
}
</style>
</head>
<body>
<div class="con">
<div class="min">
eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本
</div>
<div class="left">
eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本eeeeeeeeeeeewenb文本文本文本
</div>
<div class="right">
eeeeeeeeeeeeeeeeeee
</div>
</div>
</body>
</html>浮动后给元素添加负margin：left值他会往上？没搞明白为啥。。
1
收起
正在回答
2回答
同学你好！
效果是这样的哦，1. 这里可以这样理解 :
本来三个小盒子都设置了浮动 ,它们应该在一行显示 ,也就是左右两个小盒子要在middle后面浮动 .但是middle设置宽度100%没有它们的位置 , 把它们两个挤下去了 ：
如果这个时候我强制性的让小盒子往左移动 ,那么它就会回到第一行 , 与middle重叠 . 所以这里虽然看起来盒子是往上移动了 ,实际上是设置它往左移动哦（实际上是挤上去的） .
2.设置那么大的外边距，整个屏幕放不下，让它移动到屏幕的最左端去了，可以减小一下看效果：
如果帮助到了你，欢迎采纳，祝学习愉快~
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星