javascript - 如何删除动态内容底部的空间？

Question

我正在设计一个页面，其中 div 的底部应该触及没有底边距或填充的页面末尾，所以我将主 div 的高度设置为

 $(function() {
     $('.divMain').css({'height': (($(window).height())) + 'px'});

     $(window).resize(function() {
         $('.divMain').css({'height': (($(window).height())) + 'px'});
     });
 });

我的 HTML 是:

<div class="divMain">
    <table id="eduGrid"></table>
</div>

其中 “eduGrid” 是动态生成的(Bootstrap)。

最初它工作正常，但我在该 div 中有一些内容可以在用户端添加(添加新教育等)，以便内容移动到主 div 之外并且看起来有线。

Answer 1

检查全屏结果 - http://fiddle.jshell.net/DRRsn/1/show/light/

检查此 fiddle 代码 - http://jsfiddle.net/DRRsn/1/

CSS

html,body{width:100%;height:100%; overflow:hidden; margin:0;padding:0;}
div{background:blue;}
table{background:pink;height:100%;;width:50%}

HTML

<div class="divMain">
<table id="eduGrid"></table>
</div>

JS

$(function() {
    $('.divMain').css({'height': (($(window).height())) + 'px'});
    $(window).resize(function() {
        $('.divMain').css({'height': (($(window).height())) + 'px'});
    });
});

希望这就是您要找的。