三列布局,左右固定,中间自适应?
 <style>
body{ margin:0; padding:0; font-size:30px; font-weight:bold}
.header{height: 100px;background: #777;}
.content{height:700px;background: #000;}
.left{ width:240px; height:600px; background:#ccc; position:absolute; left:0; top:100}
.main{ height:600px; margin:0 240px; background:#9CF}
.right{ height:600px; width:240px; position:absolute; top:100; right:0; background:#FCC;}
</style>
</head>

<body>
    <div class="header"></div>
        <div class="content">
            <div class="left">left</div>
            <div class="main">main</div>
            <div class="right">right</div>
        </div>
</body>

很简单的三列布局,为什么给右边栏会浮动到下面去图片说明

css

2个回答

left和right的css添加top:100px,要不没设置top时,紧跟上一个容器的位置进行定位

fashion1993
我不正常Hen久了 回复showbo: 恩恩,记住了!
接近 6 年之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复fashion1993: 加了xhtml申明,left/top/width/height为0可以不加单位,>0一定要加,要不无效
接近 6 年之前 回复
fashion1993
我不正常Hen久了 回复showbo: 之前看过一个规范,说建议如果数值是0的话,要省略单位,但是一修改之后就忘记加单位
接近 6 年之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复fashion1993: 你添加了xhtml申明了吧,要加px单位。良好的css习惯就是不要忘记加单位
接近 6 年之前 回复
fashion1993
我不正常Hen久了 竟然忘记加px了,如果是0的话应该是可以省略的,问了个弱智的问题~~
接近 6 年之前 回复
fashion1993
我不正常Hen久了 格式乱了,left和right我都已经top:100;了,左侧显示正常,右侧就沉下去了
接近 6 年之前 回复

.left {
width: 240px;
height: 600px;
background: #ccc;
position: absolute;
left: 0px;
top: 0px;
}

    .main {
        height: 600px;
        margin: 0 250px;
        background: #9CF
    }

    .right {
        height: 600px;
        width: 240px;
        position: absolute;
        top: 0px;
        right: 0px;
        background: #FCC;
    }
            将top:0 -----> top:0px
fashion1993
我不正常Hen久了 改成100要加px啊,傻掉了
接近 6 年之前 回复
fashion1993
我不正常Hen久了 哎呀,之前0的话可以不加px
接近 6 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐