來自Foundation 4的導航元素不會顯示在iPhone上

我在我的頁面上添加了一個簡單的<nav class="top-bar">元素。它在計算機上正常顯示，但在iPhone上，我只是得到一個沒有菜單項的純黑色條。這是我的導航的最重要的部分。來自Foundation 4的導航元素不會顯示在iPhone上

<nav class="top-bar" style=""> 
    <ul class="title-area"> 
    <li class="name"></li> 
    </ul> 

<section class="top-bar-section"> 
    <ul class="left"> 
     <li class="has-dropdown not-click"><a href="#">Orders</a> 
     <ul class="dropdown"><li class="title back js-generated"><h5><a href="#">« Back</a></h5></li> 
      <li class=""><a href="orders/new.php">Create New</a></li> 
     </ul> 
     </li> 
    </ul> 
    </section> 
</nav>

來源

2013-09-23 Gargoyle

您將需要提供更多信息。也許是一個實時URL或重現問題的相關CSS。 –

https://www.gargoylesoft.com/nav/ – Gargoyle

在Opera移動瀏覽器中查看[Zurb foundation 4 Top Bar]（http://foundation.zurb.com/docs/components/top-bar.html）複製此內容。我嘗試使用HTC Desire/Galaxy S3設置。黑色的示例菜單欄顯示了這個問題 - 三條白線應顯示爲菜單圖標，但不顯示。 –

只是刪除在你的CSS高度：

.top-bar .name { 
    height: 45px; 
}

指定高度是造成<li>呈現以下<nav>，由於overflow:hidden設置，沒有被顯示<li>。

enter image description here

來源

2013-09-23 03:45:40

刪除高度會導致菜單在移動設備上溢出，因此觸摸切換不再起作用。框架帶有這個高度集（在幾個地方）。 –

來自Foundation 4的導航元素不會顯示在iPhone上

回答

相關問題