Rails 中 Foundation 5 导航栏下拉菜单的问题答案

【问题标题】：Issue with Foundation 5 Nav-bar Dropdown in RailsRails 中 Foundation 5 导航栏下拉菜单的问题
【发布时间】：2015-08-15 01:42:06
【问题描述】：

我正在使用 rails 4 应用程序中的基础框架/Gem 构建一个导航栏（要遵循的代码）。首先，我不是一个前端设计师，所以如果这是一个易于解决的问题，我深表歉意，但我似乎在搜索中找不到太多关于它的信息。

当我点击下拉项目“创建报告”时，它会在我点击它时打开并立即关闭 - 没有给任何时间来实际选择我想要跳转到的项目。

导航条码：

<div class="fixed">
  <nav class="top-bar" data-topbar role="navigation">
    <ul class="title-area">
      <li class="name"><h1><%= link_to "PatrolProRMS", root_path %></h1></li>
      <li class="toggle-topbar menu-icon"><span></span></li>
    </ul>
    <section class="top-bar-section">
    <!-- Right Nav Section -->
      <ul class="right">
        <li><%= link_to "Edit Profile" %></li> <!-- Add Registration Edit Link -->
        <li class="has-dropdown">
          <%= link_to "Create Documents" %>
          <ul class="dropdown">
            <li><%= link_to "General Patrol Report" %></li>
            <li><%= link_to "Incidnet Report - Static" %></li>
            <li><%= link_to "Incident Report - Mobile" %></li>
          </ul>
        <li><%= link_to "Sign Out" %></li>
      </ul>
    <!-- Left Nav Section -->
      <ul class="left">
      <li><%= link_to "Patrol Locations", sites_path %></li>
      <li><%= link_to "Resident Directory" %></li>
      <li><%= link_to "Visitor Parking Registry" %></li>
      </ul>
    </section>
  </nav>
</div>

我按照基金会说明指南进行了发球台操作，但不确定从哪里开始解决问题。

【问题讨论】：

标签： html ruby-on-rails-4 zurb-foundation-5

【解决方案1】：

你解决了这个问题吗？令人惊讶的是，我意外地修复了它。首先，我有一个问题，导航栏下拉在内容下重叠。然后我通过在我的css文件中添加“z-index：999”来解决它。这将使您的导航栏位于所有内容之上。这也意味着您的光标可以集中在下拉菜单上并且您可以选择。

【讨论】：