Ant-design: 等しい高さのアイテム

わかりません、 a lot of layout issuesどういう意味ですか？

行の高さ=== max（列の高さ）なので、レイアウトの問題は発生しません。 https://codesandbox.io/s/my8p6vk7wj

つまり、列（およびその他の要素）を行内の高さと同じにする機能を追加します。

あなたの例は現在次のようになっています：

ただし、 <Row equal-heights>を追加すると、コンテンツは次のように表示されます。

なるほど…リーズナブルに見えます。

たぶんvertical-fill方がいいですか？

私たちはこれが必要だとは思いません。子供の身長は子供の内容やスタイルに任せるべきです。

@ yutingzhao1991 @ ddcat1115同じ問題が発生しています。 そのための解決策はありますか？

この問題の解決策はありますか？

いいえ

type = "flex"でflexbox対応の行を使用し、列の内容で高さを100％に設定すると、うまくいきました。

<Row gutter={16} type="flex">

https://ant.design/components/grid/#Row

Alvinに感謝します。 type = 'flux'を設定することは私にとってはうまくいきます。 ただし、列の内容でも高さを100％に設定することを忘れないでください。 列自体ではなく、列の下のコンポーネントである必要があります。

グリッドにカードがあります。 行タイプを「flux」に設定し、カードの高さを「100％」に設定すると（このスレッドで提案されているように）、各カードが行の高さ全体を埋めるという意味で完全に機能します。 ただし、カードのアクションバーは行の一番下にはありません。 これは次のようになります。

行の高さまで拡張するグリッドにカードを配置し、行の下部にカードアクションボタンを配置するにはどうすればよいですか？

Metaタグでは、クラスを追加して固定の高さを指定できます。 お気に入り

<Card>
 <Meta  
  className="cardBodyStyle"
  title={key.title}
  description={key.description}
 />
</Card>

css：

.cardBodyStyle {
    height: 100px;
}

type = "flex"でflexbox対応の行を使用し、列の内容で高さを100％に設定すると、うまくいきました。

<Row gutter={16} type="flex">

https://ant.design/components/grid/#Row

これは正しい方法です

このアプローチを試して、子ノードを使用可能なすべてのスペースに（垂直方向および水平方向に）ストレッチします。

<Row gutter={16}>
    <Col span={12} style={{display: 'flex'}}>
        <Card style={{flex:1}}>
            1<br/>2<br/>3
        </Card>
    </Col>
    <Col span={12} style={{display: 'flex'}}>
        <Card style={{flex:1}}>
            1<br/>2
        </Card>
    </Col>
</Row>

私にとって、これらはどれも機能していませんでした。 解決策は、 height: 100%を削除し、Colタグにdisplay: inline-flexとalign-self: stretchた。 Col内に複数の要素がある場合は、Colに子が1つだけになるように、それらを別のコンテナーでラップする必要があります。