*{margin:0; padding:0;}
#wrap{width:970px;margin:0 auto;}
#mainbody{position:relative;overflow:hidden;margin-top:15px;}
#left{float:left;width:110px;margin-right:13px; }
#mid{float:left;width:650px;border:1px solid #999;}
#right{position:absolute;top:0;margin-left:790px;border:1px solid #999;}
#wrap{width:970px;margin:0 auto;}
#mainbody{position:relative;overflow:hidden;margin-top:15px;}
#left{float:left;width:110px;margin-right:13px; }
#mid{float:left;width:650px;border:1px solid #999;}
#right{position:absolute;top:0;margin-left:790px;border:1px solid #999;}
2017-04-21
感觉上一节课解释的有点问题，所以这节课有点误会。上一节课box2都是没有设置width的，所以会根据父包含自适应，当box1设置为float:left之后，脱离标准文档流，box2自动顶到最左边，而因为没有设置宽度，所以自适应为满屏，看起来就跟box2紧跟在box1之后出现一样的效果，其实左边是被box1挡住了而已，把box1的背景色去掉，加一个border就很明显了。
这里也是，right设置了一个定宽140px，left800px浮动之后，right顶到最左边开始出现，但是由于宽度只有140px，而不像上一节课的box2那样自适应，所以看起来就跟上一节课的box2完全不同的效果。
这里也是，right设置了一个定宽140px，left800px浮动之后，right顶到最左边开始出现，但是由于宽度只有140px，而不像上一节课的box2那样自适应，所以看起来就跟上一节课的box2完全不同的效果。
2017-04-20
最新回答 / 某星座的海星
float的元素脱离了文档流，但是没有脱离文本流,字体是认同浮动元素所占据的区域的。作者：weibo_哆啦A梦有大口袋_0链接：https://www.imooc.com/article/8915来源：慕课网第一个元素浮动之后，会让它脱离文档流，也就是说当它后面还有元素时，其他元素会无视它所占据了的区域，直接在它下面布局。所以第二个元素作为块级元素独占了一行，在它下面布局了。而上一节课是文字，文字会认同浮动元素所占据的区域，围绕它布局，也就是没有脱离文本流。
2017-04-20
*{margin:0; padding:0;}
#wrap{width:970px; margin:0px auto;}
#mainbody{position:relative; margin-top:15px;}
#left{float:left;width:110px; }
#mid{float:left;margin-left:13px; width:650px;border:1px solid #999;}
#right{position:absolute; margin-left:792px; border:1px solid #999;}
</style>
</head>
#wrap{width:970px; margin:0px auto;}
#mainbody{position:relative; margin-top:15px;}
#left{float:left;width:110px; }
#mid{float:left;margin-left:13px; width:650px;border:1px solid #999;}
#right{position:absolute; margin-left:792px; border:1px solid #999;}
</style>
</head>
2017-04-19
最新回答 / 夕叩
你的footer和header设置的宽度是100% 他的宽度取决于内部标签的宽度<div id="header"></div><div id="footer"></div> 而内部没有标签 所以宽度为0 因此你才会看不到结果
2017-04-19
最赞回答 / 慕圣4428291
可以啊，你在#mid里面用margin-left也行，不过相比在#left里面设置margin-left计算量复杂了一点，容易失误而已。另外#right里面的margin-left等于790px的计算为：left的宽（109px）+与Mid之间的marigin-left的距离(13px)+mid的左右border宽度(2*1px）+mid的宽（649px）+距离mid的距离(17px)=790px
2017-04-18
最新回答 / 左右手年华
#mainbody{position:relative;margin-top:20px;}这里错了，应该这样#mainbody { width:100%; position:relative; margin-top:20px;}
2017-04-18