把孩子放在父元素的中心

如果你看Yahoo!首頁，你會發現所有內容居中頁面，如果你調整瀏覽器窗口的大小，左右空格將被刪除，然後滾動條會出現。我想的一樣，但無論我做什麼，我不能這樣做：把孩子放在父元素的中心

<body> 
<div id="main" > 
    <div class="logo"></div> 
    <div class="content"></div> 
    <div class="copyright"></div> 
</div> 
</body>

我想main是在頁面的中心（寬度是固定的，但幅度不大）。

來源

2012-03-17 undone

比較遺憾的是，我決定只是爲了回答你的問題，這可能是一個重複的問題。 – 2012-03-17 01:34:05

@RichardAndrewLee我讀了所有的建議，告訴我！如果有的話，我不會打擾自己張貼問題。順便說一句，謝謝你的回答，它的工作;） – undone 2012-03-17 01:36:46

甜蜜：http://jsfiddle.net/tszxg/ – 2012-03-17 01:38:22

在CSS中設置它是這樣的。

#main { 
    width: 960px;/*put your width*/ 
    margin: auto; 
}

來源

2012-03-17 01:31:42

'位置：相對;'是**不**必要的。另外，檢查拼寫。 – JohnB 2012-03-17 01:59:09

你說得對，我只是習慣於把它放在我的身體上。（對於那個很抱歉） – 2012-03-17 02:18:59

1路：

#main { 
    position:relative; 
    width:600px; 
    left:50%; 
    margin-left:-300px; 
}

jsFiddle example

第二個辦法：

body { 
    text-align:center; /* Optional: IE5/6 Quirks Mode Hack */ 
} 

#main { 
    width: 600px; 
    margin: 0 auto; 
    text-align:left; /* Optional: IE5/6 Quirks Mode Hack */ 
}

jsFiddle example

來源

2012-03-17 01:32:22 JohnB

注意：此css在IE中不起作用。解決方案：

<style type="text/css"> 
body{text-align: center} 

</style>

來自：http://www.cosnetics.co.uk/articles/IE7-margin-auto-not-working/

來源

2012-03-18 16:23:03 undone

把孩子放在父元素的中心

回答

相關問題