我无法让div水平居中

Question

我无法将div #buttonwrap放在我的网站上。我尝试了this similar post中建议的每个选项。但这仍然行不通。奇怪的是#backgroundwrap在相同的代码下可以正常工作。我没有整理CSS和HTML标记，但没有帮助。

希望有人可以帮助我解决这个问题，这一直使我发疯，并删除了我几乎所有的代码！完整的代码在这里在线：http://setup.industries/projects/masqueradeclassix/

.buttonwrap {
    margin: 0 auto;
    position: relative;
    width: 100%;
    display: block;
    float: none;
}

/* parent */

#container {
    width: 100%;
    height: 100%;
 }

Answer 1

width: 100%;
margin: 0 auto;

宽度为100％，具有自动页边距。

因此计算出边距将其置于中心。

即左侧为0，右侧为0。

它是 居中。

Answer 2

好的，这就是您所需要的。我真的很想让您从那里找出解决方案，但是您可以：

.buttonwrap {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

预览

Answer 3

如果width为100％，则使用margin: 0 auto;将元素居中是没有意义的-它已经填充了容器的宽度。将width的值设置为小于100％或固定的像素值。