Javascript 在容器中设置两个元素的样式

两个元素的高度都可以独立增长，但是，我希望容器的高度始终与元素2的大小相匹配，而元素1的高度尽可能地增长，但决不能使容器超过元素2的高度。如果元素1的高度高于容器的高度，元素1将获得一个滚动条，而不会增加容器的大小

---

我目前正在用JavaScript以一种非常低效的方式做这件事，我想知道我是否可以用CSS来做这件事。谢谢。

使用flexbox可以拉伸它们。在本例中，第二个容器拉伸到第一个容器。 更详细的信息：

.outer{
对齐项目：拉伸；
显示器：flex；
}
.1{
最小高度：200px；
宽度：150px；
背景：蓝色；
}
.2{
背景：橙色；
宽度：150px；
}

---

在本例中，我使用jquery示例，如下所示 [复制并打开]

 [1]: https://jsfiddle.net/vk3qw09f/154/

---

这张照片没有显示出来。到目前为止我还不知道你的问题。。。看看flexbox，我认为这是您描述的唯一可能。我认为如果没有溢出：隐藏，用纯CSS将元素1限制为元素2的高度是不可能的；但在我看来，当你有两个独立的元素时，这是不可能的。虽然这可以从理论上回答这个问题，但在这里包括答案的基本部分，并提供链接供参考。如果链接页面发生更改，则仅链接的答案可能无效