HTML CSS表單 - 如何將頁面居中放置在頁面上？

我做了一個表格，我試圖將它居中放在頁面上，但它不起作用。我嘗試應用這2個CSS，但它沒有奏效。HTML CSS表單 - 如何將頁面居中放置在頁面上？

form{margin: 0 auto;} 

form{margin: auto;}

我也試過封閉的形式進入div.container和運用相同的CSS來，但仍然一無所獲。

但這個工程：

{margin: 0 250px 0;}

形式here

2013-03-27 Sourabh

你需要做兩件事情來實現這一目標：

1）更改inline-block在表單上顯示爲block。
2）修正寬度（您目前擁有它爲auto）。

或者，如果你不想固定窗體大小，您可以使用text-align: center（感謝@donderpiet）

2013-03-27 17:38:51 mattytommo

但是如果你想讓表單自動調整寬度呢？離開'inline-block'並將'text-align：center'添加到其父項更容易。 – 2013-03-27 17:43:46

不寬度：自動將寬度設置爲所需的最小寬度？ – Sourabh 2013-03-27 17:44:59

@donderpiet然後，你最終將**所有**的形式爲中心，就像這樣http://jsfiddle.net/bMf9M/5/ – mattytommo 2013-03-27 17:50:38

您必須指定容器的寬度與display:block屬性元素自動調整大小，以他們的集裝箱的最大寬度。

2013-03-27 17:38:32 thatidiotguy

如果您希望容器自動調整寬度>？ – 2013-03-27 17:44:44

@donderpiet然後使用像％這樣的相對單位。 – thatidiotguy 2013-03-27 18:06:00

如果您喜歡使用margin，您需要設置Width：auto;

2013-03-27 17:38:50

不在具有'display：inline-block;'屬性的元素上。 – 2013-03-27 17:41:13

你form有屬性display: inline-block;，這使它表現得像一個內聯元素。因此，您必須將text-align: center;添加到其父項以使其居中。像這樣：http://jsfiddle.net/bMf9M/4/。

不要忘記將表單的text-align設置爲left，否則它將具有中心對齊的文本。

2013-03-27 17:40:41

它也中心文本里面，我必須將其重置爲text-align：left; 有沒有更好的辦法？ – Sourabh 2013-03-27 17:45:49

我不這麼認爲，而不是使用'inline-block'值。 – 2013-03-27 17:52:57

回答