javascript - 删除html页面中的多余空间

Question

我目前正在为一个元素实现一个工具，但在删除主容器底部的一些额外空间时遇到一些困难。

基本上，包含绘图列表和 map 的容器会在窗口调整大小事件时调整自身大小。底部栏是固定的，因此不会影响任何内容。

$(window).on('resize', function () {
    resize();
});

function resize() {
    var height = $(window).height();
    var width = $(window).width();
    var mapHeight = height-260; // 260 for fixed elements
    var mapWidth = width-360; // 360 for left hand side list
    $('.map-drawings-container ul').height(mapHeight);
    $('#map_parent_container > .map').height(mapHeight);
    $('.drawings-list').height(mapHeight);        
}

首次加载页面时，它会正确呈现。然后当缩小它时，我们可以看到一个空间，似乎等于原始页面高度和当前页面高度之间的差异。

更改 html 和 body 元素的大小并不能解决问题。

使用 Google Chrome 开发工具，我无法选择灰色背景。

将主容器上的 margin-bottom 更改为负值也不会删除该空间。

关于如何删除此空间的任何线索？

谢谢

Answer 1

当然，您内部没有一个元素超出了主体，并且在其上设置了最小高度。当主体收缩到最小高度以下时，这会将粘性页脚向下推，从而产生额外的空间？

查找所有具有最小高度的元素并尝试缩小它们。