带有对齐中心的css内联块

Question

我想要一个与内容具有相同宽度的div,display: inline-block;
但是当我使用它时,text-align: center不再工作了.
所以我的内容只是左转,内联块适用于它.
像这样:

#div1 {
position: relative;
bottom: 10px;
left: auto;
text-decoration: overline underline;
display: inline;
text-align: center;
}

它不再以div的文本为中心.
我怎么能得到这两个效果？

Answer 1

将属性 text-align:center 赋予任何其他元素，并在 div 中使用该元素。

例如。

#div1 {
position: relative;
bottom: 10px;
left: auto;
text-decoration: overline underline;
display: inline;
}
#p1 {
text-align: center;
}

进而

<div id="div1">
        <p id="p1">blah blah blah</p>
</div>

那应该有效。