html - 固定标题使下拉导航栏不起作用

Question

我有一个navbar. 当我悬停它时，会出现一个下拉菜单。但是当我在我的 上放置固定标题的样式时navbar，下拉菜单直到底部才显示菜单。它看起来像被切断了。

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  left: 0;
  background-color: white;
  z-index: 999;
}

<div class="nav-item">
  <div class="container">
    <nav class="nav-menu mobile-menu ">
      <ul>
        <li class="active"><a href="#">Home</a></li>
        <li>
          <a href="#">Item1</a>
          <ul class="dropdown">
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">List Item </a>
            </li>
            <li>
              <a class="font-weight-bold">This is not Last Item </a>
            </li>
            <li>
              <a class="font-weight-bold">This is Last List Item </a>
            </li>
          </ul>
        </li>
        <li><a href="#">Item2</a>
          <ul class="dropdown"></ul>
        </li>
      </ul>
    </nav>
  </div>

这是我的导航栏截图：

截屏

谢谢

标签： htmljquerycss

Answer 1

您需要将此样式添加到您的.dropdown：

height: 100%;
overflow-y: scroll;