侧导航杆高度问题

Question

我正在开发一个后端系统，左边有一个侧导航条！

我正在使用Bulma CSS框架，并与Laravel一起开发。

我像这样做侧导航已经很久了，但出于某种原因，我有一些奇怪的高度问题，所以：

，注意，，这不是全部代码，它只是包装div，因为整个侧导航代码是140行代码。

侧导航html结构：

​

#admin-side-menu {
    position: absolute;
    width: 250px;
    left: 0;
    top: 3.5rem;
    bottom: 0;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
    height: 100%;
    z-index: 100;
    overflow-y: auto;
}

<div id="admin-side-menu">
    <aside class="menu">
    </aside>
<div>

​

现在我的问题是，只有当我有一个完全大小的浏览器窗口，我得到的高度一直到底部，如果窗口是大小的，我必须向下滚动以查看所有内容导航栏的高度不会涵盖所有的底部！

我试过高度:100%和高度:100 is；但是没有什么是有效的！

有什么想法吗？

Answer 1

你犯了一个非常愚蠢的错误

更新“职位”属性。

#admin-side-menu {
   position: fixed;
}

position: absolute将绝对定位它相对于最近的相对定位元素，或者其他相对于浏览器窗口。

即使您滚动，position: fixed也会使元素固定在特定位置。

了解有关位置属性这里的更多信息

Answer 2

试试一个max-height: 300px，或者你想要多少像素，这样看起来很好看。您还可以使用JS设置它，这取决于您拥有多少项。