Css 浮式潜水器的高度问题_Css_Css Float

Css 浮式潜水器的高度问题

css

Css 浮式潜水器的高度问题,css,css-float,Css,Css Float,我需要把两个div并排放在一起。第一个div应该具有恒定的宽度，第二个div应该具有空闲空间。两个div应具有相同的高度，但至少应占据所有浏览器屏幕。我编写了以下代码： <head id="Head1" runat="server"> <title>My Testing page</title> <style type="text/css"> #mainDiv { height:100%;} #leftDiv {float:l

我需要把两个div并排放在一起。第一个div应该具有恒定的宽度，第二个div应该具有空闲空间。两个div应具有相同的高度，但至少应占据所有浏览器屏幕。我编写了以下代码：

<head id="Head1" runat="server">
<title>My Testing page</title>
   <style type="text/css">
    #mainDiv { height:100%;}
    #leftDiv {float:left; width:200px; height:100%;}
    #rightDiv { height:100%; } 
   </style>
</head>
<body>
   <div id="mainDiv">
      <div id="leftDiv"></div>
  <div id="rightDiv"></div>
   </div>
</body>


我的测试页面
#mainDiv{高度：100%；}
#leftDiv{float:left；宽度：200px；高度：100%；}
#rightDiv{高度：100%；}

但右侧div的高度始终设置为浏览器屏幕的100%，即使该div的内容更大。我想调整这些div的高度。

据我所知

高度：100%

将根据浏览器的高度作为固定高度。那你为什么不把

最小高度：100%

这应该行得通，但我还没有亲自测试过。

您可以始终使用javascript获取px中的页面高度，将其用作最小高度值，而不是百分比。