Question

在我的网站上我有一个菜单按钮，但问题是当在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>

Answer 1

关于按钮.nav-box出现在页面底部看不见的问题？如果是这样的话，大部分问题都可能是分心。

我看到的第一件事是.nav-box有top: 0而不是bottom:0。你的意思是它在顶部还是底部？

Div向下移动到页面底部，而不是iOS中的屏幕高度按钮

1 个答案: