中心div在屏幕上，不工作在IE11上，但它在Firefox中工作

使用CSS，我試圖將div Wrapper放在屏幕上。它適用於Mozilla，但它不適用於IE 11.我不知道爲什麼。我的網頁是在Windows Server 2008上運行中心div在屏幕上，不工作在IE11上，但它在Firefox中工作

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：網頁在Mozilla

<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>

圖像。如您所見，div在屏幕中居中：

IE11中的網頁圖像。正如你看到的，DIV是不是在屏幕居中：

來源

2015-09-25 Delmonte

你應該在IE11中工作。可能還有其他相互衝突的風格。 –

-1

試試這個：

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標籤內部的身體寬度減去625px（div寬度的一半）的50％處，該寬度是瀏覽器寬度的100％。

來源

2015-09-25 22:59:16

你應該解釋你的答案，爲什麼這是一個解決方案。 – Rob

@Orry：我試過你的代碼，但得到了相同的結果。我將其改爲1250px，而不是50px。而不是25px，我將其更改爲625px。可能是與服務器的一些配置？在我的電腦中，它工作正常。 – Delmonte

我不認爲這將是一個糟糕的服務器配置，因爲這是呈現瀏覽器端。也許這將有助於：http://stackoverflow.com/questions/396145/how-to-vertically-center-a-div-for-all-browsers –

中心div在屏幕上，不工作在IE11上，但它在Firefox中工作

回答

相關問題