文字对齐中心不起作用

Question

在我的网站上，我有一个固定的页脚位置，我想在其中放置居中的文本。 奇怪的是，无论我在做什么文本，都不会居中，而是始终留在原处。

<div id="footer">  
Copyright 2013 © LolStreamGallery - <a href="TermsofUse.html">Terms of Use</a>
</div>

CSS：

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
}

也许您还想了解身体的CSS：

body {
    background-color:#ededed;
    /*text-align:left;*/
    margin:0;
    padding:0px; 
}

如您所见，我已经尝试过取消默认的正文对齐方式，但是没有任何效果。 有人有主意吗？

Answer 1

更改为此：

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
    width:100%; // added
}

jsFiddle现场演示

Answer 2

您的页脚需要在底部延伸。 为您的#footer样式元素添加width：100％。

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    width:100%;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
}

http://jsfiddle.net/4zqbX/

Answer 3

将#footer设置为position: fixed ，它不再具有宽度。 因此从技术上讲，内容#footer内仍集中#footer ，但#footer需要这是从它的内容的宽度宽。 因此，您必须摆脱position: fixed或给#footer一个宽度。 如果您添加width: 100% #footer width: 100% ，则应该可以使用。

Answer 4

也许您需要在#footer中添加宽度

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
    /*New*/
    width:100%;
}​

测试： http ： //jsfiddle.net/h6crw/1/

Answer 5

这是因为文本位于div的中心，但是如果添加边框，则可以看到div与文本一样大。

只需添加width:100%; 到页脚，然后完成。