使用zurb的导航栏中的搜索字段和框具有黑色背景

Question

我在rails应用程序上遇到了一个奇怪的错误，我想在导航栏中显示搜索字段和按钮，但视图看起来像这个图像

问题是它在背景中只有搜索框和按钮的黑色。

以下代码如下：

<section class="top-bar-section">

  <ul class="left">

    <%= form_tag('/search') do %>

      <li>

        <%= text_field_tag :query, nil ,:placeholder => "Search for designs", :id=>"nav_search_box" %>

      </li>

      <li>

        <%= submit_tag 'Search', :class=>"round button", :id=>"nav_search_btn" %>

      </li>

    <% end %>

  </ul>

</section>

非常感谢有关修复此错误的任何见解！

Answer 1

在官方文档中，在其他元素下对此进行了解释。

http://foundation.zurb.com/docs/components/top-bar.html

“可以在导航中使用一个小的基础按钮，只需将has-form包含为其父li的类。”