mui でこのカードの高さを同じにする方法は? 私は高さを固定するのが好きではありません。これは動的に変更する必要があります。すべてのカードの高さは、Web サイトで最も高い高さに設定する必要があります。 ボタンとコンテンツの間にスペースを追加できます。どうすればいいでしょうか？
あなたが直面していると思われる問題は、マテリアル UI ライブラリを使用してコンテンツの高さが可変のカードを作成したいが、固定の高さを設定せずにすべてのカードを同じ高さにしたいことです。また、ボタンとコンテンツの間にスペースを追加することもできます。
コードサンドボックス
ああああ
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
デフォルトでは、各グリッド項目の最大高さは同じです。 グリッド項目の下のコンポーネントの高さを
100%に設定できます。これは一例です。 https://stackblitz.com/edit/react-8qnvck?ファイル=demo.tsx,MediaControlCard.tsx
この例では、
MediaControlCardコンポーネントはCardプロパティとsxプロパティを使用して高さを 100% に設定します。sx属性を削除すると、同じような状況が発生します。そして、
Boxコンポーネントでdisplay:flexを使用する必要はないと思います。display:flexを使用すると、height:100%が有効にならないためです。