爲什麼我的div不在頁面的中心？

我的結果：http://i.imgur.com/P50RS.png 我的style.css爲什麼我的div不在頁面的中心？

body { 
background: url("img/bgs.png") repeat #cccccc; 
color: #000000; 
} 


main { 
margin-left: auto; 
margin-right: auto; 
}

我的index.html

<html> 
<head> 
<title>Progress</title> 
<link rel="stylesheet" href="css3-progress-bar.css" /> 
<meta http-equiv="content-type" content="text/html;charset=utf-8" /> 
<link type="text/css" href="style.css" rel="stylesheet" /> 
</head> 

<body> 


<div id="main"> 
<p><b>215/160 LBS.</b></p> 
<div class="bar_mortice rounded green_mortice"> 
     <div class="progress rounded green" style="width: 05%;"></div> 
    </div> 
</div> 


</body> 

</html>

爲什麼文本中沒有中心？此外，進度條沒有集中，直到我添加了

margin: 0 auto;

我試過在主要但沒有運氣。有任何想法嗎？

來源

2013-01-12 Vernard

在CSS中，您需要使用#main而不是main。

此外，你會想給它一些寬度，否則它可能佔用整個寬度。試試這個：

#main { 
margin-left: auto; 
margin-right: auto; 
width: 50%; 
}

來源

2013-01-12 19:16:42 speedplane

'div＃main'是矯枉過正，'#main'就夠了。另外'邊際：自動'爲一個整潔的代碼 –

@ThanhTrung我同意你'div'，但我是明確標記每邊的邊距和填充的吸盤。明確性是值得的冗長。 – speedplane

@speedplane我試着用margin：0 50px;但是酒吧頂部的文字將會關閉。沒有死在中心。我添加了空白左/右再次自動，它在右側。爲什麼？ – Vernard

爲什麼我的div不在頁面的中心？

回答

相關問題