html - 页脚 float 在 div 之上

Question

我有一个浮在我的 div 顶部的页脚。它在 desktop View 上运行良好，但在 mobile 和 tablet 分辨率下保持 float 。

Problem - the footer is floating over the div on mobile and tablet resolutions.

我知道问题的原因是什么，但我无法解决问题。原因是页脚上方有一个 float 的div。因为在其他页面中，页脚工作得很好。我在下面为其添加了 css。

页面示例:

<div>
    <img />
</div>
<div class="overFlow">
    Floating div over the image. The footer is sitting here
</div>
<footer>
    This floats on mobile view and desktop view.
</footer>


<style>
    .overFlow {
        position: absolute !important;
        top: 50%;
        left: 0%;
    }
</style>

Answer 1

有一个解决方案，即如果它不重要，则从中删除 top:50% 但如果您只需要 50% 而不是使用媒体查询。

@media screen and (max-width:750px)
{
.overflow
{
position:absolute;
top:0%;
}
}

所以在桌面上它会正确出现，在 750 以下的移动尺寸中，在 750 时它会在顶部和底部的页脚。

谢谢