以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中心内容的方式？

回答

相关问题