使用IE定位DIV

我正在嘗試將一個DIV與"margin:auto"對齊。它正常工作與Chrome和FF，但下面的代碼不與IE居中DIV：使用IE定位DIV

CSS

#container { 
margin:auto; 
width:950px; 
height:50px; 
background:#000; 
}

HTML

<div id="container"></div>

我在做什麼錯？

感謝，

喬爾

編輯（完整的HTML/CSS代碼）：

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.2.0/build/cssreset/reset-min.css"> 
<style> 

#container { 
margin: 0 auto; 
width:950px; 
height:50px; 
background:#000; 
} 
</style> 
</head> 
<body> 
<div id="container"></div> 
</body> 
</html>

來源

2010-10-21 Joel

？我通常定義一個'寬度'，然後設置'margin：0 auto'並且它在IE中工作正常... – 2010-10-21 13:44:59

試過用IE9測試它！我使用上面的代碼... – Joel 2010-10-21 13:45:53

是的，但正如Sime所說的使用margin：0 auto;您只有保證金：汽車 – Rob 2010-10-21 13:48:34

試試這個;

#container { 
margin:0 auto; 
width:950px; 
height:50px; 
background:#000; 
}

來源

2010-10-21 13:48:54 Rob

使用margin：0 auto;使得不會有絲毫的差異 – Alex 2010-10-21 13:51:04

@Alex請小心，如果這種改變會對IE造成影響，我不會感到驚訝。 IE有很多奇怪的錯誤 – 2010-10-21 13:53:21

相信我，事實並非如此。這是因爲海報很可能沒有有效的文檔類型。雖然我確實知道你在處理大量IE錯誤時來自哪裏！ – Alex 2010-10-21 13:57:47

這應該幫助你：

body { 
    text-align: center; 
} 

#container { 
    text-align: left; 
    margin:auto; 
    width:950px; 
    height:50px; 
    background:#000; 
}

你這樣做無可厚非，IE6的作用：它忽略了「保證金：汽車;」

來源

2010-10-21 13:50:29 Thomas

自從IE5.5我相信這個方法並沒有被要求。自動邊距一直在IE中工作......這只是確保瀏覽器不是以怪癖模式呈現的情況。 – Alex 2010-10-21 13:56:29

IE9？也許下次你不得不說你在談論IE9。 – Thomas 2010-10-21 13:56:57

IE9測試版是精確的... – 2010-10-21 14:01:21

插入這個在文件的頂部：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

或html5：

<!DOCTYPE html>

Reference for document type declaration

來源

2011-07-05 11:20:48

保證金自動居中

問題：當中心DIV標籤通過auto-left; margin-left：auto;或保證金權利：汽車;

html, body { 
text-align: center; 
}

不要忘了，現在給你的段落和標題添加爲上述設置，將導致：設置，這不會在Internet Explorer中，除非你添加以下到您的樣式表的HTML體工作這些也是中心。

p {text-align: left;}

來源

2011-08-15 20:35:02

你應該擺正&左屬性在那裏也：

#container 
{ 
    right: 0px; 
    left: 0px; 
    margin: 0px auto; 
    width: 950px; 
}

來源

2013-04-08 16:22:50 dougczar

您需要引用文檔類型由 '2astalavista'

否則

1.Center提到使用定位和負邊距如果是已知寬度

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.2.0/build/cssreset/reset-min.css"> 
<style> 


#container { 
position: relative; 
left: 50%; 
margin: 0 0 0 -475px; /* negative margin of half the width */ 
width:950px; 
height:50px; 
background:#000; 
} 

</style> 
</head> 
<body> 
<div id="container"></div> 
</body> 
</html>

2。使用outercontainer和文本對齊中心到中心元素：對我來說

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.2.0/build/cssreset/reset-min.css"> 
<style> 

#outerContainer{ 
text-align: center; 
} 

#container { 
margin: 0 auto; 
width:950px; 
height:50px; 
background:#000; 
} 
</style> 
</head> 
<body> 
<div id="outerContainer"> 
     <div id="container"></div> 
</div> 
</body> 
</html>

來源

2014-03-25 12:28:46 askthebigo

這一個工作：

#container { 
    width: 80%; /* or the width of the object inside the container */ 
    margin-left: auto; 
    margin-right: auto; 
}

你與測試哪個版本的IE瀏覽器的這個代碼

來源

2017-01-10 09:47:39

回答

相關問題