Html 中心对齐的css内联块

我想要一个与内容宽度相同的div，它由

display:inline块完成

但是当我使用这个时，
text align:center
不再工作了。

因此，我的内容只需向左移动，并对其应用内联块。

像这样：

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

它不再以div的文本为中心。

如何获得这两种效果？
获得相同的div是一项宽度
的工作，而不是
显示
。使用
text align
时，此属性将应用于元素的所有子元素

例如，在

<div>
 <span>Text</span>
 Text
</div>

span {
  text-align: center;
}

这是明确的答案，您正在将此div内的文本对齐到中心

mouseover事件必须在函数或脚本中的某个位置。在
悬停
事件或相同事件时触发。
尝试使用以下方法：

margin-left:auto;
margin-right:auto;

在要居中的div的父div中。
将属性文本align:center指定给任何其他元素，并在div中使用该元素

例如

然后

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


废话


这应该行。
请创建一个JSFIDLE，而不是发布一个简单的请求。请在此发布一个完整的代码示例。您可以发布一些代码或演示吗？只是做了同样的事情。对不起，请尝试对实际的div而不是父div执行此操作！那么，我怎样才能得到一个中间有sme宽度作为文本的div呢？为此，你可以对div的父级使用
text align
，比如说，
body
，如果它是唯一的div。或者你可以对某些属性使用
margin left
和
margin right
。我使用了
\dived{margin left:auto；margin right:auto；}
作为父div，但它仍然保持在左侧。如果应用了
max width
或
min width
，则这将起作用。否则它将始终保持在左侧。只需稍加编辑，它就会工作。onmouseover仅在文本上触发，而不是在整个宽度上触发。但是当您对p1使用
文本对齐：居中
，对div1使用“display:inline”时。我交换了它们。谢谢
#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>