Question

我想将扬声器div居中，这位于评论区内。我似乎无法让它工作。：（

HTML：

<div class="review">
<div class="speaker">
<p>SPEAKER DIV</p>
</div>
</div>

CSS：

.speaker{
align:center;
}

这不起作用：/

Answer 1

没有align这样的CSS属性。

当你说你想要“集中”扬声器div时，你究竟是什么意思？

您可以将其文字居中对齐：

.speaker {
    text-align:center;
}

（见http://jsfiddle.net/pauldwaite/X7LN5/）

或者，如果您希望扬声器div只与文本一样宽，并且位于评论div的中心，那么您需要使用它：

.review {
    text-align:center;
}

.speaker {
    display:inline-block;
}

（见http://jsfiddle.net/wxha4/）

Answer 2

给它一个宽度和边距：0自动;

<div class="review">
    <div class="speaker">
        <p>SPEAKER DIV</p>
    </div>
</div>

div.speaker{
    background-color:red;
    width:100px;
    margin:0 auto;
}

See it in action!

Answer 3

我大约迟到了一年，但是这里有：

在大多数浏览器中，这都可以：

.speaker{
    margin: 0 auto;
}

但是，在IE8及以下版本中，margin:auto将不起作用（IE8仅在没有！DOCTYPE声明时才会起作用。See W3Schools Horizontal-Align Tutorial）

在这种情况下，您可以使用text-align: center和width的组合来获得所需的效果：

.review{
    text-align:center;
}
.speaker{
    text-align:left;
    width:200px;
    margin:0 auto;
}

此方法的缺点是您必须声明宽度，否则它不会居中。

祝你好运！

Answer 4

效果很好。

.speaker{ 
margin: 0 auto;
text-align:center;
width:100%;

}

祝你好运

Answer 5

试

.speaker p{
text-align:center;
}

或

.speaker {
 text-align:center;
 }

Answer 6

那是因为语法不存在。您需要通过margin属性将div居中。

.speaker{
    margin:0px auto 0px auto;
}

DEMO http://jsfiddle.net/t4kBj/

Answer 7

CSS中没有align属性。将水平边距设置为自动以使块居中。有关详细信息，请参阅Centring using CSS（包括解决Internet Explorer问题的方法）

Answer 8

给父母一个text-align：center; 然后，您可以将孩子移动到父div的任何地方

.speaker {
       margin: 0 auto;

css中心div不工作

8 个答案: