Javascript 如何根据底部div调整顶部div的大小

我有一个带图表的顶部div，底部div在每行末尾包含四行。我有一个关闭图标单击该关闭图标，特定的行消失，因此剩余的行应该向下移动。顶部div应该占用剩余的空间。如何在css或javascript中执行此操作。我从Angular JS使用ng repeat的概念，这样行就会重复

如果下面的行数可能会改变，我建议使用FlexBox。 在父div（包装图表和行）上：

在图表包装上：

flex: 1 0 0%; 

这将使图表包装器div占用父div的所有剩余空间。 如果您想支持旧浏览器，请不要忘记供应商前缀：

display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;

-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;

以及：

---

如果您还没有，请花一些时间阅读更多关于FlexBox的信息。有些人声称这是多年来添加到CSS中的最好的东西，我必须同意，它们解决了很多布局问题。

你能给我一个代码片段或线框的截图吗？我已经附加了线框，请检查。我已经附加了线框。请检查它。请提供一些代码片段或一些参考。谢谢你永远正确。我将尝试这个解决方案。

display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;

-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;

-webkit-box-flex: 1 0 0%;
-moz-box-flex:  1 0 0%;
-webkit-flex:  1 0 0%;
-ms-flex:  1  0 0%;