居中一层未指定的宽度

Question

为了记录，我已阅读How do I center a div with an unspecified width?并发现尽管我的问题与此有关，但并非如此。

我有一个只包含一个图像（我网站的徽标）的图层，没有别的。现在我知道徽标图像的大小（宽度）（以及图层的宽度），如果我指定图层的宽度，我可以将它放在页面的中心。那就是：

#logodiv {
position:absolute;
width:200px;
margin:auto;
}

和网页内容

<div id="logodiv">
<img src="logo.png" />
</div>

然而，为了使我的网站对较小的显示尺寸设备更具响应性，我不想在硬数字和快速数字中指定logodiv的宽度。但后来我无法将我的徽标图层放在页面的中心。

有什么解决方法吗？

Answer 1

如果你的标记看起来像这样：

<div id=logodiv>
  <img src="logo.png">
</div>

然后你可以使用这种风格

#logodiv {
  width:max-content;
  margin: 0 auto;
}

将其水平居中。

Answer 2

试试这个 -

#logidiv{
margin:0px auto;
display:flex;
justify-content:center
}