Question

我有以下html：

<div style="height:300px;width:300px;background:red;display:block;">
<div style="height:30px;width:300px;background:blue;display:block;">
</div>
<div style="overflow:auto;height:100px;">
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
</div>
</div>

我的问题是，滚动条当前显示在＆＃34; height：100px＆＃34;。我希望根据窗口的大小调整高度，这样如果我将最外面的div的高度改为200px或400px，则可以自动调整最里面div的高度。我有办法在模板中做到这一点吗？我想做点什么：

<div style="overflow:auto;height:{{ -insert javascript to get height of the containing div so this value can be correct without hardcoding- }}px;"></div>

我宁愿省略高度，但如果要显示滚动条，则需要它。这可能吗？如果没有，什么是好的选择？

注意：我希望滚动条位于div的整个高度上的红色＆＃39;而不是整个盒子。（这意味着我不希望看到红色和蓝色重叠的滚动条）

Answer 1

添加溢出：自动到最外面的div并删除代码中父级的第二个孩子的溢出和高度

如何使用angular2基于当前div大小自定义高度css？

1 个答案: