Html 粘性导航栏的粘性问题

希望有人能解决我的问题：

我已经在我的项目网站上为中等及以上尺寸创建了一个粘性的无活力条。它工作得非常好。我还有一个带有下拉窗格的标题栏，其中有相同的导航链接。这适用于小型屏幕。它也很好用

然而，我想让标题栏变得有粘性，但似乎无法做到这一点。我尝试了我能想到的每一种组合，但雷曼没有成功(

这是我的密码：

<!-- Sticky top navigation bar - for medium and larger displays -->
<nav class="cell hide-for-tiny-only hide-for-small-only medium-12" data-sticky-container>
<ul class="sticky menu" style="width: 100%" data-sticky data-top-anchor="NavTop" data-btm-anchor="NavEnd:bottom" data-options="marginTop:0;">
<li class="nav"><a href="page1.html"><i class="fi-list"></i><span>Home</span></a></li>
<li class="nav"><a href="page2.html"><i class="fi-list"></i><span>Products</span></a></li>
<li class="nav"><a href="page3.html"><i class="fi-list"></i><span>Garden Guru</span></a></li>
<li class="nav"><a href="page4.html"><i class="fi-list"></i><span>Contact Us</span></a></li>
</ul>
</nav>

这个有用

<!-- Top navigation bar with drop-down menu - for small and tiny displays -->
<nav class="cell title-bar hide-for-medium" style="width: 100%" data-sticky-container>
<div type="button" class="sticky menu-icon" data-sticky data-top-anchor="NavTop" data-btm-anchor="NavEnd:bottom" data-options="marginTop:1;" data-toggle="nav-dropdown" style="height: 2em"></div>
<div class="dropdown-pane" id="nav-dropdown" data-dropdown data-hover="true" data-hover-pane="true" data-position="bottom" data-alignment="left">
<ul class="menu vertical drop">
<li><a href="page1.html">Home</a></li>
<li><a href="page2.html">Products</a></li>
<li><a href="page3.html">Garden Guru</a></li>
<li><a href="page4.html">Contact Us</a></li>
</ul>
</div>
</nav>

这不可能(

谁能解决我的问题