[英]Issues with css height 100% for div
我已经在Visual Studio中开发了一个aspx页面。 我的布局是这样的
<asp:Content ID="Content2" ContentPlaceHolderID="MasterContentPlaceHolder" runat="server">
<div id="setting_wrapper">
<div id="settings_controls">
<ul>
<li><a href="javascript:void(0)" id="user"> <span style="padding-left:2%"></span> USER MANAGEMENT</a></li>
<li><a href="javascript:void(0)" id="Admin"> <span style="padding-left:2%"></span> EMS</a></li>
<li><a href="javascript:void(0)" id="Others"> <span style="padding-left:2%"></span> PRODUCT</a></li>
<li><span style="padding-left:2%"></li>
</ul>
</div>
<div id="settings_container">
<iframe id="settings_iframe">
</iframe>
</div>
</div>
</asp:Content>
如果我给settings_wrapper 100%的宽度和高度,则它在chrome中可以正常工作,并正确获取宽度。 但是在IE和firefox中, "width:100%"
没有占用,我需要给600px
扩展settings_control div。 可能是什么原因
应用的css是
#setting_wrapper
{
position:relative;
/*background:yellow;*/
width:100%;
height:100%;
overflow:hidden;
}
#settings_controls
{
position:relative;
float:left;
width:20%;
height:100%;
/*background:green*/
}
#settings_container
{
position:relative;
float:right;
width:80%;
height:100%;
/*background:blue;*/
}
我什至尝试给
html, body {
height: 100%;
width: 100%;
}
应用display: table;
确保可以在所有浏览器中使用。
尝试这个 :
#setting_wrapper {
position:relative;
width:100%;
height:100vmin;
overflow:hidden;
}
或你这个:
html, body {
height: 100vmin;
width: 100%;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.