html - 角度弹性布局增长参数不会将行扩展到最大可用空间

Question

我想创建下表，其中 Div 3 增长到完成可用高度。

我正在使用以下代码，但没有成功：

<div fxFlex fxLayout="column">
  <div fxFlex="nogrow">Div 1</div>
  <div fxFlex="nogrow">Div 2</div>
  <div fxFlex="grow">Div 3</div>
  <div fxFlex="nogrow">Div 4</div>
</div>

产生

它适用于fxLayout="row"，但不适用于列布局。有人知道我错过了什么吗？谢谢

编辑：

CSS是

 div {
   border: 1px solid black
 }

标签： htmlcssangularflexboxangular-flex-layout

Answer 1

包含 4 个 div 的父 div 似乎没有在 CSS 中明确设置任何高度。所以它只是适合内部内容，不会让内部 div 增长。您可以尝试为父 div 设置一些高度，看看是否可行。它对我有用！