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