為什麼在 Flex 項目上設定固定高度不會影響其大小？

對於這個例子來說，處理這一行就足夠了：

.flex-item {
    ... ;
    height: auto;
}

修改它的值：

.flex-item {
    ... ;
    height: 50px;
}

這個修改將根本不改變任何東西。高度仍會自動計算。

要讓所有方形單元格讀取如下：

這是使用 Flexbox 使所有單元格成為方形的一種可能方法。

1. 要限制縱橫比，無論是手動還是絕對值，請按照您已經做的那樣設定百分比。
2. 然後重置這些儲存格上的 Flexbox 相關高度/寬度為自動。這些確保項目在更改時不會調整大小以適應容器大小。

.flex-item {
  ... ;
  height: auto;
  width: auto;
  min-width: 50px; /* minimum width of 50px; adapt to your needs */ 
}

以上是為什麼在 Flex 項目上設定固定高度不會影響其大小？的詳細內容。更多資訊請關注PHP中文網其他相關文章！