最小和最大宽度弄乱了文本对齐中心

Question

小提琴:http: //jsfiddle.net/uK7w6/1/

<h1>this is a really, really long sentence</h1>

h1 {
    min-width:100px;
    max-width:100px;
    text-align:center;
}

如果你摆脱了最大和最小宽度,句子中心很好,但我希望它中心,而不是占据整个宽度.添加宽度约束时,为什么文本左对齐？

Answer 1

其中的文本h1实际上是居中的,但它居中于a 100px width box.如果你想让h1漂浮在中间,window那么添加一个margin:0 auto;.h1与左边对齐的主要原因与display:box属性有关.

<h1>this is a really, really long sentence</h1>
<style type="text/css">
h1 {
    min-width:100px;
    max-width:100px;
    text-align:center;
    margin:0 auto;
}
</style>