在将div类居中时遇到麻烦

Question

我试图将页脚放在网站的中心，但是由于某种原因，这次我无法正常使用的方式。 谁能告诉我为什么？

网站在这里

它使用两个类设置，一个内部另一个

第一个称为mainFoot：

.mainFoot {
background-color: #184879;
width: 100%;
height: 60px; /*had to include this because it would not appear otherwise. browser read it as a 0 height container*/
display: block;
clear: both;
}

第二个是页脚：

#page-footer {
width: 990px;
display: block;
clear: both;
margin:0 auto;}

我在底部的小部件上方使用了相同的结构，并且按原样工作，但是由于某种原因，当我设置此结构时，我不得不为外部div设置height属性，因为它不会出现读取内部div的高度并进行调整。

作为参考，他提到过类似的设置，DOES的工作就在mainFoot类之上，并且由b4Foot和half-widgets类控制：

.b4Foot {
background-color: #277bc1;
width: 100%;
display: block;
clear: both;
}

.half-widgets {
width: 990px;
min-height: 200px;
margin: 0 auto;
color: #fff;
}

Answer 1

要居中放置块的内容，您需要设置样式“ text-align：center”。 但是，请注意，您不能将一个块型元素居中放置在另一个块型元素内。 内部元素需要具有内联或内联块的显示样式。

要解决您的问题，您需要：a）删除固定宽度，并b）将页脚更改为display：inline-block。 由于类clearfix，当前它是display：table-您需要从div中删除该类。

Answer 2

您只需要更改此行，请参见下面并放入CSS并查看结果

.mainFoot
{
    background-color:#184879 !important;
    height:60px;
    width:auto;
}
footer.span12 { color:#DEDEDE; width:100%;}
#page-footer { display:block; margin:0 auto; width:990px;}

仅在.mainFoot，footer.span12和＃page-footer上更改

谢谢，