右侧部分,我使用的是 float:right;才可以实现效果
老师您好。 教程中left、middle、right都是 float:left; 但是我的代码这样设置的话,右侧块的位置不对,我把right的float设置为right即可显示出正确的效果,请问下是什么原因哦,谢谢!
我的代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
.* {
margin:0;padding:0;
}
body {
min-width: 700px;
}
.container {
padding:0 220px 0 200px;
}
.left,.middle,.right {
position:relative;
float:left;
min-height:300px;
}
.middle {
background-color:blue;
width:100%;
}
.left {
background-color:red;
width:200px;
margin-left:-100%;
left:-200px;
}
.right {
background-color:green;
width:220px;
margin-left:-100%;
float: right;
/*right:-220px;*/
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="container">
<div class="middle">我是中间的我是中间的我是中间的我是中间的我是中间的我是中间的我是中间的我是中间的我是中间的我是中间的</div>
<div class="left">我是左边的</div>
<div class="right">我是右边的</div>
</div>
</body>
</html>
正在回答
.right { background-color:green; width:220px; margin-left: -220px; right: -220px; }
right这样设置可以解决
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星