居中一層未指定的寬度

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

嘗試這個 -

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

Answer 2

如果您的標記看起來是這樣的：

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

那麼你可以使用這種風格

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

水平居中它。