2013-07-03 67 views
0

我想在水平居中放置在我的頁面上的一切,當它在一個較小的屏幕上。水平居中頁面的全部內容

目前一切正常;

這裏是我的CSS:

@media screen and (max-width: 1038px) { 
.wrapper{ 
    margin-left: auto; 
    margin-right: auto; 
    width: 100%; 
} 
} 

我也試過margin: 0 auto;無濟於事。 text-align:center;只會改變其div內的文字。

我正在瀏覽的網頁是http://tcsdesignreno.com/nvvolunteers/

請讓我知道如果你能幫助,謝謝您!

+0

你需要更多的「反應」添加到您的塊元素。他們只是停止安裝更窄的集裝箱並倒下,但它們的寬度幾乎保持不變。 – marlenunez

+0

這就是主意。我希望他們都保持相同的寬度,並移動到其他人以下。客戶不希望元素變寬。我需要讓他們全部居中,不要排在左邊。 – MattM

+0

在這種情況下,您必須刪除浮動並在較小寬度的css上設置'margin:0 auto'。 – marlenunez

回答

1

我會看看這些以及對網站元素的響應能力。雖然看起來你已經有這樣的事情發生。

有一種可能性,你將不得不拿出一些特定的東西爲你的目的。但使用其中之一併瞭解它們是如何做到這一點將是制定自己的解決方案的一個很好的起點。

+0

這些可能工作,但我真的不想回去重組整個網站。我們正試圖在一天到兩天內推出。有沒有辦法讓CSS中的每個元素都在包裝中心? – MattM

+0

答案是否定的。沒有'.wrapper * {margin:0 auto; '魔法黑客。您需要更好地瞭解網絡開發,尤其是響應式設計。因爲這似乎是你想要的。在網上學習響應式網頁設計有很多很好的資源。而且還有更好的舊模擬書籍形式。我的朋友沒有這個人的捷徑。堅持下去,你會到達那裏。 – hungerstar

-2

您可以使用一個表是這樣的:

<table width="1038px" align="center"> 
    <tr> 
     <td> 
      your main content 
     </td> 
    </tr> 
</table> 
+0

我真的不想回到在我的HTML中使用表格。沒有辦法用CSS來做到這一點嗎? – MattM

+0

我崩潰了,實際上嘗試了這一點,但它根本不起作用。 – MattM

+0

Downvoted用於爲佈局建議表格,並很快使用已停用並且大多數未使用的屬性,如「align」。 – hungerstar

0

css

#content{ 
    width: 1038px 
    margin-right: auto; 
    margin-left: auto; 
    padding: 10px; //paddig might make this width a but more so you might need narrow that 
    text-aling: center; 
} 

我不知道,如果我這樣做文本阿玲正確的,但類似的東西,可以幫助