Блог

Я делаю демонстрацию 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; , чтобы моя боковая панель отображалась должным образом?

Вот ссылка на мой код

Вам нужно добавить top: 0; в свой .sidebar класс, затем вы можете удалить display: flex; .