HTML固定div，相对div

编程问答 2022-04-26

问题描述

| 我正在寻找看起来像这样的两个div： 
<div style=\"height:20px;\" />
<div style=\"height:100%;\" />
这给了我两个div，一个div的高度为20px，另一个为整个屏幕高度的100％，这将放置一个垂直滚动条，值为20px。我真正想要的是一个像素为20px，另一个像素为100％-20px。我知道IE具有calc（）方法，但是难道没有更简单的方法可以在所有浏览器中使用吗？     

解决方法

        
#div1 {
    height:20px;
    position:fixed;
    top:0px;
    right:0px;
    left:0px;
} 
#div2 {
    position:absolute;
    top:20px;
    bottom:0px;
    right:0px;
    left:0px;
}
也许这就是您所需要的。 EDIT对不起，误读了标题。..更正了：O如果您希望有多个div2，则可能需要一个类似的结构 
<div id=\"div1\"></div>
<div id=\"div2\" style=\"overflow:auto\">[multiple div2 go here]</div>
    ,        我尝试了一下，在您的div中添加了一些示例文本，并通过不给第二个div高度，而让浏览器（即IE和FF）自行找出要提供的隐藏内容，从而摆脱了滚动条。它。 但是，考虑到您对乔治的评论，我认为这也可能不是您的解决方法。也许您可以发布更多代码（或伪代码），以给出至少一个替换第二个div的典型示例。     ,        有一个简单的方法：将第一个div（20px）放在第二个div内。 编辑：由于我的第一个答案不是您的选择，因此您可以使用脚本快速调整div的大小。您可以计算
document.height - 20px
并将结果应用为\“ 100％\” div的高度。 CSS没有提供一种方法： 
height: 100% - 20px
但是，JavaScript可以： （通过jQuery ：） 
$( \"#big_div\" ).height( $( document ).height() - 20 );
    ,        如果可以提供固定的宽度，则可以不使用任何Javascript： http://jsfiddle.net/mNNeq/47/ 以下是帮助您定位内容的绝佳资源： http://www.barelyfitz.com/screencast/html-training/css/positioning/     
divhtml固定相对