ホームページ >ウェブフロントエンド >CSSチュートリアル >`minmax()` がグリッド行を最小サイズではなく最大サイズに拡張するのはなぜですか?

`minmax()` がグリッド行を最小サイズではなく最大サイズに拡張するのはなぜですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-05 20:39:12973ブラウズ

Why Does `minmax()` Expand Grid Rows to Maximum Instead of Minimum Size?

minmax() は最小値ではなく最大値に調整されます

グリッド テンプレート行に minmax() を設定しようとしているときに、それが観察されましたグリッド行が最小値ではなく最大値まで拡張されたことを確認します。この動作により、グリッド行を最小サイズに保ち、必要な場合にのみ拡張する方法についての問題が生じます。

解決策

一般に、トラックは最大サイズに達することを目指します。 、空き領域を均等に分配します。制限を超えずにタイトなラップの望ましい動作を実現するには、次の調整を検討してください。

  • 行サイズを minmax(50px, min-content) に変更して、コンテンツの周囲に行をタイトにラップし、コンテンツの周囲に行が配置されないようにします。 50 ピクセル未満に縮小します。
  • グリッド項目の最大高さを 150 ピクセルに制限するには、max-height: 150px を実装します。 150px.

これらの変更を組み合わせると、グリッド行は指定された最小サイズのままになり、必要に応じて最大サイズまで拡張されます。

以上が`minmax()` がグリッド行を最小サイズではなく最大サイズに拡張するのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。