Zurb基金会5 - 响应表和下拉按钮

当试图用一个下拉或拆分下拉按钮TD细胞内与zurb基础响应表，会发生以下情况：按预期在浏览器Zurb基金会5 - 响应表和下拉按钮

HTML（） IPAD（按预期工作）TD元素内 IPhone（下拉隐藏和无法点击）

代码：

<td class="text-center"> 
    <a href="#" class="tiny round button split">Actions<span data-dropdown="drop"></span></a><br> 
    <ul id="drop" data-dropdown-content class="f-dropdown"> 
     <li><%= link_to show_image, cancellation %></li> 
     <li><%= link_to edit_image, edit_cancellation_path(cancellation) %></li> 
     <li><%= link_to delete_image, cancellation, method: :delete, data: { confirm: 'Are you sure?' } %></li> 
    </ul> 
    </td>

的响应表的格式是这里示出的一个： Crafty Responsive Tables Playground

有什么建议吗？

我试图在下拉按钮中放置默认的显示/编辑/销毁操作，这些操作通常与共轨表相关联。

来源

2014-02-08 Joel Dezenzio

听起来像它可能是一个简单的CSS问题。如果下拉菜单仍在工作，但隐藏在另一个元素后面，请尝试为td设置一个CSS规则，将其z-index设置得更高。

如果它的包含元素具有z-index集合，但这可能不起作用，所以您可以尝试再次使用CSS删除任何z-index规则。

developer.mozilla.org/en-US/docs/Web/CSS/z-index

来源

2014-02-08 22:36:01 danwarfel

我测试过这个，并没有什么区别。我已经证实索引可以保留，但他们不会将内容带到前面。 –

这个问题是有点老了，但仍然适用，因为我只是碰到了这个问题与工作没有在iPad上（任何一代人）的下拉按钮。

一些google搜索后，我发现a solution that worked：

的变化在这里discribed解决iPad的下拉菜单中的问题。

我chaged代码

<li class='has-dropdown not-click'> 
    <a>Menu dropdown</a> 
    <ul class='dropdown'> 
      <li><a href='aulas.php'>Aulas</a></li> 
      <li><a href='locais.php'>Locais</a></li> 
    </ul> 
</li>

到

<li class='has-dropdown not-click'> 
    <a href='#'>Menu dropdown</a> 
    <ul class='dropdown'> 
     <li><a href='aulas.php'>Aulas</a></li> 
     <li><a href='locais.php'>Locais</a></li> 
    </ul> 
</li>

缺乏HREF = '＃' 是在我的情况的原因。

来源

2015-10-06 07:09:55 blnc

Zurb基金会5 - 响应表和下拉按钮

回答

相关问题