以WordPress爲主題的CSS中心內容的方式？

我想弄清楚一種CSS方式來居中我的內容。這是我的網站：http://www.thegrassrootsgarage.com/?preview_id=41&preview_nonce=58439a219d&_thumbnail_id=-1&preview=true。以WordPress爲主題的CSS中心內容的方式？

請注意內容是如何粘在主頁左側的？我想在我的CSS的#wrapper＃主要內容中保留720像素寬度，但我不確定如何居中對齊內容並使其出現在屏幕中間。我只想讓左對齊的文本（文本將保持左對齊，因爲內容將居中）從中心開始。我已經嘗試過文本對齊，對齊內容，頁邊距：0和其他一些內容，但是我可能會讓它們的位置錯誤，因爲我沒有完全熟練地閱讀這個特定的CSS頁面。

最終，文本將左對齊，內容將位於中心。我試圖改變內容的位置，本身，它應該採取文本（這仍然是左對齊，與它）。有任何想法嗎？

下面是一些總體的CSS爲我的網站和WordPress的主題：

#header, 
#main-content, 
#wrapper-footer { 
    float: left; 
    height: auto; 
    position: relative; 
    width: 100%;   
}  
#wrapper #main-content { 
    padding: 28px 28px 10px; 
    width: 720px;   
} 
#content { 
    float: left; 
    width: 750px;  
}

我能夠在#wrapper指定＃主內容的寬度從956px改爲720像素，這是大小約我希望我的內容是，但我希望它居中！我不知道該怎麼做，如前所述，我嘗試了各種方法。也許我正在爲這個特定目的編輯錯誤的項目？

當然，如果需要的話，我可以提供其餘的CSS。

來源

2017-03-02 wbhyatt

我注意到你的style.css在你的主內容中聲明瞭一個浮點數。也許這是因爲通常在那裏有一個側邊欄。一個簡單的解決辦法是有這樣的：

#wrapper #main-content { 
    padding: 28px 28px 10px; 
    width: 720px; 
    margin: 0 auto; //<-- added this line 
    float: none; //<-- added this line 
}

您必須確保這是以後頁面上的其他樣式聲明。

修訂

非常真實的。它會影響每一頁。在主題的主體類中，它爲帖子輸出page-id- {number}。因此，您可以爲此頁面設置非常特定的CSS，或爲您選擇的任何其他頁面創建非常特定的CSS。這應該工作：

.page-id-41 #main-content { 
    float: none; 
    margin: 0 auto; 
}

附註 - 我不小心添加了回答你最初的問題 - 但我已經刪除，並在這裏

來源

2017-03-03 00:27:43

由於加入吧！這有效，但我最終不得不對另一行代碼執行「float：none」。感謝您的幫助，歡呼！ – wbhyatt

哦，還有最後一件事！因此，通過上述操作，它（自然而然地）拋棄了我網站上其他頁面的一些間距。這是可以預料的，但我想知道這一點：我不能有這種特殊變化的方式影響我網站上的一個特定頁面？我基本上只是想繞過頁碼X的這段代碼。所以在這個頁面上，內容不會居中，並且會和之前一樣。再次感謝所有的幫助。 – wbhyatt

當然 - 我的壞@wbhyatt。要定位主題中的特定頁面，您可以查看主體類。我已經在上面更新了我的初始答案。 –

以WordPress爲主題的CSS中心內容的方式？

回答

相關問題