Question

所以我有一个简单的页面： www.kensandbox.info/centerthis

这是一个简单的html / css页面，我正在尝试添加一个paypal按钮。

问题是我无法弄清楚如何将按钮居中？我尝试添加以下内容：

<div align="center"> form code here </div>

没有骰子。我甚至尝试在表单前添加中心标记。

站点代码（简单的html和css文件）可以在这里下载：

www.kensandbox.info/centerthis/centerthis.zip

我的猜测是其他CSS元素之一覆盖了我的变化。

我错过了什么？

由于

Answer 1

mycss.css

中的float:left中有一个form input, form .btn

如果要覆盖，请将float:none添加到该输入。

Answer 2

在不查看代码的情况下，我会说将div居中的最佳方法通常是确保它显示为块元素（默认情况下应该是这样）并指定其宽度;然后最后申请保证金：自动。

e.g。

<div class="container">
    ...
    <div class="centered-element"> form code here </div>
    ...
</div>

，其中

container {
    width: 200px;
}
centered-element {
    width: 150px;
    margin: auto;
    display: block; /* to make sure it isn't being mucked up by your other css */
    float: none; /* to make sure it isn't being mucked up by your other css */
}

编辑：

我说是这样做的，因为，就像我现在看到有人评论过，<div align="center">已被弃用，<center>标记也是如此。要进行扩展，这是因为您的HTML只应用于创建网页的结构和语义，而CSS应该用于它的表示方面。从长远来看，尽可能保持两者分开将为您节省大量时间。

最好以一种不必在div上设置display: block;的方式来设计你的CSS（因为div已经是一个块元素）而且你不应该通过使用float: none;。有关更好的方法，改善您的工作流程，节省一些时间，并且通常很棒，请检查面向对象的CSS a.k.a. ooCSS

为什么我的paypal按钮不在我的页面中心

2 个答案: