【发布时间】:2017-05-28 21:32:36
【问题描述】:
在我的网站上,我有一个菜单按钮,但问题是当在 iPhone 和 iPad 中查看该网站时,该按钮最终位于页面底部,而不是位于屏幕底部。因此,在向下滚动到页面底部之前,您看不到该按钮。
我了解到 iOS 存在一些问题,所以我想这与此有关。 bottom: 0; 将按钮移动到页面底部而不是屏幕底部。但这仅在您按下按钮后才会发生(并且菜单从左侧切换出来)
我想要的只是按钮无论如何都应该留在屏幕的按钮上。而且我猜在这种情况下它不会因为菜单,因为它在点击它之前就可以工作。
我的 CSS:
.nav-box { /* this is the button */
position: fixed;
z-index: 999;
bottom: 0;
left: 0;
background: #b26f7e;
opacity: 0.8;
padding: 4px 13px 4px 12px;
font-size: 28px;
color: #fafafa;
cursor: pointer;
}
.pushmenu { /*this is the nav*/
background: #72ce9b;
font-family: Arial, Helvetics, sans-serif;
width: 240px;
z-index: 998;
position: fixed;
top: 0;
bottom: 0;
}
<nav class="pushmenu pushmenu-left text-center">
<a class="navbar-brand" href="/sv/">
<img src="" width="200" style="margin-top: 20px;" />
</a>
<ul class="text-left">
<li></li>
</ul>
</nav>
<div class="nav-box">
<i class="fa fa-bars" aria-hidden="true"></i>
<i class="fa fa-times" aria-hidden="true" style="display: none;"></i>
</div>
【问题讨论】: