使用 css,我试图将 div Wrapper 置于屏幕中央。它适用于 Mozilla,但不适用于 IE 11。我不知道为什么。我的网页在 Windows Server 2008 中运行。
CSS
div#wrapper
{
width: 1250px;
min-width:1250px;
max-width:1250px;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom:0;
margin-left: auto;
margin-right: auto;
margin: auto;
border: 2px solid red;
}
aspx:
<head runat="server">
<title></title>
<link href="Styles/Site.css" type="text/css" rel="stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div id="wrapper">
HELLO
<br />
<asp:Button ID="Button1" runat="server" Text="Button" />
</div>
</form>
</body>
Mozilla 中的网页图像。如您所见,div 在屏幕上居中:
IE11 中的网页图像。如您所见,div 不在屏幕中心:
最佳答案
试试这个:
body
{
width:100%;
height: 100%;
}
div#wrapper
{
width: 1250px;
min-width: 1250px;
max-width: 1250px;
position: absolute;
top:0;
bottom:0;
left: calc(50% - 625px);
border: 2px solid red;
}
编辑:我已经对其进行了测试,它可以在 IE11 中运行。
解释一下代码:它会将您的 div 放置在 body 标签内 body 宽度的 50% 减去 625px(div 宽度的一半),该宽度是浏览器宽度的 100%。
关于css - 在屏幕上居中 div,在 IE11 上不起作用,但在 Firefox 上可以,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32791715/