时间戳

首页 > 解决方案 > 我在移动设备上的菜单在 safari 上不起作用

html - 我在移动设备上的菜单在 safari 上不起作用

问题描述

我正在为客户开发网站，但我遇到了菜单响应性问题。当您使用 Safari 打开网站并使用移动设备宽度时，单击右上角的汉堡后将无法访问菜单。

这是html：

<input type="checkbox" id="nav" class="hidden"> <label for="nav"  class="link burger"><i></i><i></i><i></i></label>
<div  class="menu">
  <ul class="menu_ul">
   <li><a class="link fir" id="act">o nás</a></li>
   <li><a class="link sec">rezervace a ceník</a></li>
   <li><a class="link thr">dárkový poukaz</a></li>
   <li><a class="link fou">časté dotazy</a></li>
   <li><a class="link fiv">kontakt</a></li>
 </ul>
</div>

这里是 CSS：

#nav:checked ~ .menu {

  z-index: 9990;
  opacity: 1;
  display: block;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

}

#nav:checked ~ .menu ul li a {

  opacity: 1;
  z-index: 9999;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-transform: translateX(0);
          transform: translateX(0);

}

在这里您可以找到网站http://stinohra.com

标签： htmlcsssafari

解决方案

推荐阅读