Html 使div元素居中

我有一个容器，我想中心，但它似乎不工作。我已经把右边和左边的边距设置为“自动”，但是右边的边距被卡住了，这让人很沮丧

.music .pane {
    margin-top: 15%;
    margin-right: auto;
    margin-left: auto;
    max-width: 70%;
    display: inline-block;
    font-size: 110%;
    background: rgba(240,240,253,0.90);
    padding: 22px 32px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -moz-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -webkit-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
}

---

您需要将

div

保留为块元素

.music .pane {
    margin-top: 15%;
    margin-right: auto;
    margin-left: auto;
    max-width: 70%;
    display: block;
    font-size: 110%;
    background: rgba(240,240,253,0.90);
    padding: 22px 32px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -moz-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -webkit-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
}

---

您可以完全删除

内联块

以使div居中

.music {
    margin-top: 15%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 110%;
    background: rgba(240, 240, 253, 0.90);
    padding: 22px 32px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -moz-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -webkit-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
}

---

您只需对CSS进行一些更改：

.music.pane {
    background-color: blue;
    margin-top: 15%;
    margin-right: auto;
    margin-left: auto;
    max-width: 70%;
    font-size: 110%;
    background: rgba(240,240,253,0.90);
    padding: 22px 32px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -moz-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -webkit-box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
    -box-shadow: 0 0 18px rgba(0, 0, 0, 0.9);
}

---

这将使

div

水平居中。

请发布您的HTML`display:inline block；`？请尝试“显示：块；”（注意：这只是猜测，可能没有帮助）。另外：你能给我们安排一把小提琴来重现这个问题吗？然后我们可以玩它，并找出它：）我认为你只需要删除内联块…除了删除内联块，你可能需要设置一个以像素或百分比为单位的宽度值（而不仅仅是最大宽度）。内联块是一个问题，但我试图使容器小到里面最大的子容器。@BrockAmhurst-nope，

最大宽度就足够了。