浏览器高度设置

Question

.fixed-table-box>.fixed-table_body-wraper{/*内容了表格主体内容有纵向滚动条*/
    max-height: 600px;
}
.fixed-table_fixed>.fixed-table_body-wraper{/*为了让两侧固定列能够同步表格主体内容滚动*/
    max-height: 580px;
}

如图所示，我这个页面左侧是固定的，右侧可根据滚动条拖动查看数据
当数据增多时，在笔记本上和大屏显示器上设置max-height就不合适了
我尝试用js获取浏览器高度，可是在浏览器上还没完全展示数据就出现了滚动条

console.log('document.documentElement.clientHeight',document.documentElement.clientHeight)
    
var h = document.documentElement.clientHeight;//获取页面可见高度
document.getElementsByClassName("fixed-table_body-wraper")[0].style['height'] = h-20+"px"; //掐头去尾，减去20px

这样只只设置了.fixed-table-box>.fixed-table_body-wraper的高度
请问我要怎么写才能根据浏览器动态高度，且根据数据的变化在大小屏幕上看着都正常