float浮动问题

#left{width:110px; float:left;}

#mid{width:650px;border:1px solid #999;margin-left:123px;}

在本节里面，没给#mid设置margin-left的时候，#mid怎么被挤到下面去了，而且为什么不是设置13px

陈国侯

2016-11-29

源自：网页布局基础 5-1

关注问题我要回答

435

操作

收起

4 回答

qq_微微_4 回答被采纳 +3 积分
2016-12-22

#mid{ width:650px;border:1px solid #999;position:absolute;

margin-left:123px;}

首先#mid应该上面写法，应该设置绝对定位absolute，所以13px间距，应该是#left的宽度110px+13=123px，应该设置margin-left:123px;被挤到下面是因为他是绝对定位。

0 回复有任何疑惑可以回复我~

收起回答

陈国侯提问者

非常感谢！

2017-01-20 回复有任何疑惑可以回复我~

qq_微微_4
2016-12-22

任务2：请在右侧编辑器中补全代码，使用浮动实现#left和#mid横向两列排版，并且两者之间有13px间距;

题目是#left和#mid都设置为float:left; 所以margin-left:13px; 你设置的margin-left:123px;应该是绝对定位，在#mid上加上 position:absolute;就行了

0 回复有任何疑惑可以回复我~

收起回答

壹莣3139121
2016-11-29

#mid{float:left;margin-left:13px;width:650px;border:1px solid #999;}

0 回复有任何疑惑可以回复我~

收起回答

慕设计1136939
2016-11-29

*{margin:0; padding:0;}

#wrap{width:970px; position:absolute;top:0;margin:0 auto;}

#mainbody{position:absolute; margin-top:15px;}

#left{float:left;width:110px; }

#mid{float:right;margin-left:123px;width:650px;border:1px solid #999;}

#right{position:absolute;margin-left:790px;border:1px solid #999;}

</style>

</head>

0 回复有任何疑惑可以回复我~

收起回答

0/150

提交

取消

网页布局基础

参与学习 214742 人
解答问题 1756 个

让你精通CSS中三大定位机制，彻底掌握网页布局的相关知识

进入课程

float浮动问题

我要回答关注问题

热搜

最近搜索清空

float浮动问题

4 回答

float浮动问题