為什么 position：已修復； 不在 CSS 中工作？

Question

我正在制作 HTML 和 CSS 的演示。 我的頁面內容不多，但有側邊欄和抽屜。 我在側邊欄中面臨一個問題。

我將以下 CSS 應用到我的側邊欄：

.sidebar {
    margin: 0;
    padding: 0;
    width: 250px;
    background-color: #f1f1f1;
    position: fixed;
    right: 0;
    height: 100%;
    overflow: auto;
}

之后，我應用display: flex; 父div元素的屬性現在我的側邊欄顯示在右側。

我的問題是：為什么我需要display: flex; 讓我的側邊欄正確顯示？

這是我的代碼的鏈接

Answer 1

您需要添加top: 0; 到您的.sidebar class，然后您可以移除display: flex; .