浮动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>
但是右侧 div 的高度始终设置为浏览器屏幕的 100%，即使该 div 的内容更大。我想要调整这些 div 的高度。
I need to put two divs side by side. First div should have constant width, second take rest free space. Both of the div should has the same height but at least should takes all browser screen. I have written the following code:
<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>
But height of the right div is always set to 100% of browser screen, Even if content of this div is bigger. I would like have resizable height of those divs.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
据我所知
height:100%将根据浏览器的高度充当固定高度。那么为什么不输入
min-height:100%。这应该可行，但我自己还没有测试过。
As far as I know
height:100%would act as a fixed height according to the browser's height.so why dont you put
min-height:100%.This should work but I havent tested it myself tbh.