                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /如何用CSS进行网页布局

请看看我的代码有什么问题～

<html>

<style type="text/css">

.top{height:100px;background:blue;top:0;margin:0 auto;}

.head{background:#ff7a56;height:100px;width:500px;margin:0 auto;}

.left{width:100px;height:500px;float:left;background:grey;}

.main{height:500px;margin:0 auto;background:pink;top:0;}

.right{width:100px;height:500px;float:right;background:#ededed;}

</style>

<div class="top">
<div class="head"></div>
</div>

<div class="left">啦啦啦</div>
<div class="main">123</div>
<div class="right">456</div>

</html>

请问为什么我最右边的分栏“456”会跑到下面去～

彭沛兔

2016-07-06

源自：如何用CSS进行网页布局 5-1

关注问题我要回答

498

操作

收起

1 回答

雾隐风华回答被采纳 +3 积分
2016-07-06

.main{height:500px;margin:0 auto;background:pink;top:0;} 这个里面的margin不能这么写，你可以直接给mian写一个宽度，加一个float:left；你在；两个浮动之间写margin没用,可以试试这样.main{height:500px; width:500px; float: left;background:pink;top:0;}