中心div并保持其长度与文本内部一样宽，而不设置宽度

Question

我如何将div标题居中并保持其长度与文本内部（我的标题）一样宽，而不设置.headline的宽度。

<div class="sidebar">

    <div class="headline"><p>My title</p></div>

</div>

现在我正在使用这个css，但“我的标题”是由php生成的，长度不同：

.headline {
    width: 5em;
    background: #900;
    color: #FFF;
    text-align: center;
    text-transform: uppercase;
    line-height: 2em;
    border: solid 1px #555;
    border-top: none;
    padding: 0;
    margin: 0 auto
}

谢谢

Answer 1

.sidebar {
  text-align: center;
}
.headline {
  display: inline-block;
}

Answer 2

像这样写：

.sidebar{
 text-align:center;
}
.headline {
    background: #900;
    color: #FFF;
    text-align: center;
    text-transform: uppercase;
    line-height: 2em;
    border: solid 1px #555;
    border-top: none;
    padding: 0;
    display:inline-block;
    *display:inline; /*For IE7*/
    *zoom:1; /*For IE7*/
}