首页 > 解决方案 > 手机上的固定div不固定

问题描述

我需要在屏幕底部固定一个操作栏。

以下 CSS 在桌面模式下运行良好:

        <div class="slds-p-around--large actions">

            <lightning-button-stateful
                    label-when-off="Check All"
                    label-when-on="Uncheck All"
                    label-when-hover="Uncheck All"
                    icon-name-when-off="utility:check"
                    icon-name-when-on="utility:close"
                    icon-name-when-hover="utility:close"
                    selected={selected}
                    onclick={handleMasterSelection}>
            </lightning-button-stateful>

            <button class="slds-button slds-button--success" onclick={handleApprove}>Approve</button>
            <button class="slds-button slds-button--destructive" onclick={showConfirmationModal}>Deny</button>
        </div>

.actions{
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #F3F2F2;
    left: 0;
    display: block;
    height: 8vh;
    z-index: 10000;
}

但在移动模式下它不起作用,div 不固定。我必须滚动到页面底部才能看到它。
有什么线索吗?

标签: htmlcssmobile

解决方案


只需更改background-color: #000;并删除left: 0;它就可以了。


推荐阅读