Html CSS：在固定大小的溢出div中展开列的高度_Html_Css

Html CSS：在固定大小的溢出div中展开列的高度

html css

Html CSS：在固定大小的溢出div中展开列的高度,html,css,Html,Css,我想在固定大小的溢出div中扩展列的高度使用溢出：自动，高度：100%不会扩展到滚动的末尾在我的JSFIDLE中，我希望红色列与蓝色列的大小相同正如Blazemonger所说，您可以在溢出的div中的div上使用display:flex来实现这一点 HTML <html> <body> <div class="row row-scroll"> <div class="content"> <div

我想在固定大小的溢出div中扩展列的高度

使用

溢出：自动

，

高度：100%

不会扩展到滚动的末尾

在我的JSFIDLE中，我希望红色列与蓝色列的大小相同

正如Blazemonger所说，您可以在溢出的div中的div上使用

display:flex

来实现这一点

HTML

<html>
  <body>
    <div class="row row-scroll">
      <div class="content">
        <div class="column blue">
          AAA BB CC DD AAA BB CC DD AAA BB CC DD D AAA BB CC DD AAA BB CC DD
        </div>
        <div class="column red">
          BBB
        </div>
      </div>
    </div>
  </body>
</html>

请看

这听起来像是一份工作，因为我也尝试过同样的工作，但没有成功。。我忘了从高度中删除100%：p因此我采用了一种老套的解决方案是的，对不起，我忘了提到我必须从其中一列中删除100%的高度；）

.row-scroll {
  height: 130px;
  overflow-y: auto;
  background-color: gray;
}
.content {
  display: flex;
}