對齊設置寬度的CSS元素

我有一個CSS元素，它應該是1000像素的固定寬度。這裏是我有的CSS代碼：對齊設置寬度的CSS元素

#content 
{ 
    margin:auto; 
    background-color:#DDDDDD; 
    position:absolute; 
    top:110px; 
    width:1000px; 
}

Tis設置寬度，位置和顏色完美，但它總是對齊左側。我希望整個文本塊與中心對齊。我嘗試使用HTML來做到這一點：

<div id="content" align="center"> 
Some test content 
</div>

但是，這隻能對文本里面的文本，而不是元素本身。這裏是什麼樣子：

http://gyazo.com/b44a28edfecb9cbfc3a5afe93fa08d8a

任何IT對準中心的幫助深表感謝。提前致謝！

來源

2013-06-03 Ryan Sparks

你應該居中div用CSS來代替。

事情是這樣的：

#content 
{ 
background-color:#DDDDDD; 
width:1000px; 
margin: 110px auto; /*center the element and set top margin to 110px*/ 
} 

<div id="content"> 
Some test content 
</div>

來源

2013-06-03 21:54:24

刪除position:absolute;使其居中居中。

我看不到很多你的html結構。如果您的垂直位置受此影響，然後嘗試改變margin:auto到：

margin: 110px auto 0;或margin: 0 auto如果你想從一個絕對位置中心的元素

來源

2013-06-03 21:46:01 Omega

我想水平居中 –

@RyanSparks我知道，我偶然垂直類型！ – Omega

哦，謝謝！我改變它爲相對，但它縱向和橫向對齊，當我只希望它水平對齊... –

，這一個STIL應該還處於靜態上下文。例如：

.absolute { 
    position:absolute; 
    left:0; 
    width:100%; 
} 
.center { 
    width:500px; 
    margin:auto; 
    border:solid; 
} 
.static { 
    padding-top:5em; 
}

來源

2013-06-03 21:54:10

<!DOCTYPE> 
<html> 
    <head> 
     <style> 
      #content{ 
       background-color:#DDDDDD; 
       width:1000px; 
      margin: 0 auto; 
      } 
      #wrapper{ 
      width: 1300px; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="wrapper"> 
      <div id="content" align="center">Some test content</div> 
     </div> 
    </body> 
</html>

來源

2013-06-03 22:19:35 Yelko

對齊設置寬度的CSS元素

回答

相關問題