高人指点，div自动适应屏幕高度

我想大部分都有这个纠结的问题吧。为了直奔主题。俺直接举个例子了..

  比如类似这样子的。

           <body>
              <div id="div1"></div>
           </body>
在body中有个div，如果想让div覆盖整个屏幕。那么宽度可以设width=100%，但是高度的100%却不管用。纠结了一个晚上。。还没纠结个所以然出来。上百度看了好多例子。。貌似都没有实现出来的。

   还有就是另外一个问题。。

           <body>
              <div id="div2"></div>
              <div id="div3"></div>
           </body>

div2和div3是并排的。而且要充满整个屏幕、。
   css样式为#div2{
              width:168px;
              float:left;
             }
  但是我的div2有个效果就是通过按钮可以隐藏也可以显示出来的。。这样一来div3的宽度就不好确定了。。div3的宽度要随div2的宽度变化而变化。。╮(╯▽╰)╭。。求高手帮帮忙。。俺快不行了、T.T

10 个解决方案

#1

第一个问题：你的鼠标滚轮为什么是竖着的而不是横着的。想固定高度好像只能设具体数值吧。
第二个问题：#div3{width:100%;float:left;overflow:hidden;}不知道行不行，本人新手，楼下继续……

#2

嘿嘿。。还是谢谢了哈。。

#3


#layer1{ 
 width: 600px; 
 float:left; 
 background:#FFFFFF; 
 text-align:left; 
} 
#layer3_left{ 
 width: 600px; 
 float: left;  
 position:relative; 
 margin-left:-600px; 
 backgrund:#0F6;
} 
#layer2_right{ 
 width: 170px; 
 float: right; 
 position:relative; 
 margin: 0 -170px 0 0; 
 background: #f00; 
}


<div id="layer1">
	<div id="layer2_right">
    我是right<br /><br /><br /><br />我是right
		<div id="layer3_left">我是left</div>
	</div>
</div>

#4

自适应高度居中的话可以自己在外层套div

引用 3 楼 w250840443 的回复:

CSS code

#layer1{
width: 600px;
float:left;
background:#FFFFFF;
text-align:left;
}
#layer3_left{
width: 600px;
float: left;
position:relative;
margin-left:-600px;
backgrund:#0F……

#5

html,body {height:100%;}
#div2,#div3 {height:100%;}
#div3 {overflow:auto;}

#6

#7

导入JQuery，接着
    <script type="text/javascript">
        $(document).ready(function() {
            var h = $(window).height(), h2;
            $("#master_left").css("height", h);
            $(window).resize(function() {
                h2 = $(this).height();
                $("#master_left").css("height", h2);
            });
        })
    </script>

#8

楼主height：100%是管用的啊，你试过没有

#9

我也想知道方法。我试了很久，用尽了各种方法，都只能设 width=100%，但是高 height=100% 真的不管用

#10

我也是新手，但是觉着好像得用 margin

#1

#2