text-align:居中；不起作用

Question

我一直在摆弄我的网站布局，我的text-align : center;在我将所有div位置设置为相对后停止工作，当我使用javascript向其添加组件时，父div会改变大小。

下面是我的两个CSS文件：

您可以在下面的JSfiddle链接中看到新版本。

jsFiddle：http://jsfiddle.net/2WvrV/

我还提供了旧网站的代码(它正确地对齐了文本)：

http://jsfiddle.net/fiddlerOnDaRoof/fQpjX/

旧的超文本标记语言与新版本非常相似，我只是在其中一个div中添加了style="float:left;“

Answer 1

终于想明白了。我需要做的就是将clear:left;添加到我的loginBttn目录中，之后一切都会正常工作

感谢你努力帮助每个人

Answer 2

简而言之:您的文本不居中，因为元素是浮动的，并且浮动的元素“收缩”到内容，即使它是块级元素。

你能解释一下这是什么意思吗？

当我使用javascript向父

添加组件时，我必须将所有位置都设置为相对，以使父div更改大小。

Answer 3

在CSS中任何有float:left;的地方，在它后面添加width: 100%;。浮动会扼杀你想要的中心对齐。

另外，在#login中添加text-align: center;