用CSS橫向居中內容

我有一個有頁腳的網站。頁腳是簡單的灰色背景。我想將一些絕對大小的內容放在該頁腳中。在努力做到這一點，我嘗試了以下內容：用CSS橫向居中內容

<div style="background-color:gray; font-size:10pt; width:100%;"> 
    <div style="margin-left:auto; margin-right:auto; text-align:center;"> 
    <table border="0" cellpadding="0" cellspacing="0" style="width:800px; padding:8px 0px; text-align:center;"> 
     <tr> 
     <td><img alt='' height="75" width="75" src="/images/img1.png" /></td> 
     <td><img alt='' height="75" width="75" src="/images/img2.png" /></td> 
     <td style="text-align:center; color:White;"><table border="0" cellpadding="0" cellspacing="0" style="text-align:center; width:100%;"> 
      <tr><td> 
      <a href='index.html'>HOME</a> | 
      <a href='about.html'>ABOUT</a> | 
      <a href='contact.html'>CONTACT US</a> 
      </td></tr> 
      <tr><td>123 Pine Street | City, State 12345 | 1-800-555-5555</td></tr> 
      <tr><td style="font-size:8pt;">Copyright Company, Inc. | All Rights Reserved</td></tr> 
     </table></td> 
     <td><img alt='' height="75" width="75" src="/images/img3.png" /></td> 
     <td><img alt='' height="75" width="75" src="/images/img4.png" /></td> 
    </tr> 
</table> 
</div></div>

爲什麼我的800像素的桌子不在中間？

謝謝！

來源

2011-03-26 user609886

text-align不適用於表本身。在桌上嘗試margin: auto。

一個很簡單的例子：

<table style="background: #0f0; width: 800px; margin: auto"><tr><td>content</td></tr></table>

來源

2011-03-26 15:34:57 afranz409

你需要第二嵌套div的寬度設置爲800像素的自動餘量工作。現在它與包含div的寬度相同，所以邊距不起作用。當其他答案指出時，您也可以將自動邊距放在表格上。

來源

2011-03-26 15:37:04 primehunter326

要麼這樣，還是樣式添加到表中，而不是 – afranz409 2011-03-26 15:39:53

正如我在第二句指出。如果你走這條路線，第二個分區並不是真的需要。 – primehunter326 2011-03-26 15:49:25

刪除圍着桌子div和添加下面的樣式表：

margin: 0 auto;

來源

2011-03-26 15:37:46 Lauw

用CSS橫向居中內容

回答

相關問題