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

关于自适应

我在父盒子中设置了margin：0 auto；右边的盒子没有设置宽，为什么不能自适应。缩小浏览器窗口后，浏览器下面出现滚动条。

慕田峪9815236

2016-06-27

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

关注问题我要回答

811

操作

收起

3 回答

慕工程8099857
2016-06-30

main不要设置宽度，否则right确实是自适应了，但适应的是main的宽度除去left宽度之后的宽度

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

收起回答

Happy_learning
2016-06-29

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>混合布局编程挑战</title>
<style type="text/css">
body{ margin:0; padding:0; font-size:30px; color:#fff}
.top{height:100px;background:#CCC;}
.main{height:600px;background:red;}
.left{width:200px;height:600px;background:blue;position:absolute;left:0;top:100px;}
.right{height:600px;background: #9acc99;margin-left:210px;}
.foot{height:100px;background:#FF6634;clear:both;}
</style>

</head>

<body>
<div class="top">top</div>
<div class="main">
    <div class="right">right中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文ight中文</div>
    <div class="left"></div>
</div>
<div class="foot">foot</div>

</body>
</html>

你参考下我的。。