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

Question

fiddle : 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 中的文本实际上居中，但它在 100px 宽度的框 中居中。如果您希望 h1 float 在 window 的中间，则添加一个 margin:0 auto;。 h1 左对齐的主要原因与 display:box 属性有关。

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

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