如何从菜单底部删除iPhone阴影

Question

**我很难去除菜单底部的阴影。我已经搜索并尝试了其他类型的解决方案，但仍然对我不起作用。我写错了吗？我包含我的HTML文件，因此很容易为您提供帮助。我正在使用Bootstrap4 **

@media (max-width: 991px) {
    .navigator-container, .navigation-wrapper {
        -webkit-appearance: none !important;
        -moz-appearance: none;
        appearance: none;
        background: transparent;
        outline: none;
        border-radius: 0;
        background-clip: padding-box;
    }

    .navigator-container {
        position: fixed;
        top: 0;
        left: 0;
        float: none;
        width: calc(100vw - 80px);
        max-height: 100vh;
        white-space: nowrap;
        overflow: hidden;

        .navigation-wrapper {
            height: calc(100vh - 55px);
            overflow-y: auto;

            &-inner {
                display: flex;
                flex-direction: column-reverse;
                justify-content: flex-end;
            }
        }

        #main-navigation {
            display: block;
            height: auto;
            -webkit-appearance: none !important;
            -moz-appearance: none;
            appearance: none;

<div class="navigation-wrapper">
<div class="navigation-wrapper-inner">
<nav id = "service-navigation">
<ul>
<li>
<a href="#" data-toggle="modal" data-target="#currency-selector">...</a>
</li>
<li>
<a href="#" data-toggle="modal" data-target="#login-modal" class="wdio-corp-login"><span class="service-texts">Company Login</span></a>
<a href="#" data-toggle="modal" data-target="#change-booking-modal-modal"><span class="service-texts">ChangeBooking</span></a>
</li>
</ul>
</div>
</div>