Question

我有一个水平导航栏，该导航栏浮动在页面顶部。对于某些菜单选项，需要一长串链接。对于较高分辨率的显示器，这很好。对于较低分辨率的显示器，不是因为并非所有链接都可见。

我希望为分辨率较低或窗口高度较短的链接列表显示滚动条。我尝试使用各种方法来设置ul标签的高度和溢出选项。固定的高度显然不会起作用。我尝试设置不同的vh值，但这似乎也没有达到我想要的效果。

<li class="menu-has-children"><a href="">OPTIONS</a>
    <ul style="height: auto; overflow-y: auto; overflow-x: hidden;">
      <li><a href="#">Option 1</a></li>
      <li><a href="#">Option 2</a></li>
      <li><a href="#">Option 3</a></li>
      <li><a href="#">Option 4</a></li>
      <li><a href="#">Option 5</a></li>
      <li><a href="#">Option 6</a></li>
      <li><a href="#">Option 7</a></li>
      <li><a href="#">Option 8</a></li>
      <li><a href="#">Option 9</a></li>
      <li><a href="#">Option 10</a></li>
      <li><a href="#">Option 11</a></li>
      <li><a href="#">Option 12</a></li>
      <li><a href="#">Option 13</a></li>
      <li><a href="#">Option 14</a></li>
      <li><a href="#">Option 15</a></li>
      <li><a href="#">Option 16</a></li>
      <li><a href="#">Option 17</a></li>
      <li><a href="#">Option 18</a></li>
      <li><a href="#">Option 19</a></li>
      <li><a href="#">Option 20</a></li>
    </ul>
</li>

基于窗口高度的导航链接长度

0 个答案: