【问题标题】:Making a css grid equal height rows independently使css网格等高行独立
【发布时间】:2021-01-22 10:24:21
【问题描述】:

我正在尝试制作一个等高行的 CSS 网格(它是一个产品网格)。现在所有行的高度都相等,但它们应该独立地等高,这意味着并非所有行都应该是相同的高度,只是每一行都应该是该特定行上最大列的高度。

现在我的css是这样的:

grid-template-columns: repeat(4, 1fr);
grid-auto-rows: 1fr;
grid-column-gap: 0;
grid-row-gap: 0;
display: grid;

但是我怎样才能让每一行根据任何给定行中最大的列调整它们的高度。

希望这是有道理的

【问题讨论】:

  • 从行中删除 1fr

标签: css css-grid


【解决方案1】:

你需要删除grid-auto-rows: 1fr;或者设置auto(grid-auto-rows: auto;)

检查示例:- https://codepen.io/rvtech/pen/qBaGEoW

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-11-13
    • 2019-02-02
    • 2019-10-16
    • 2020-12-09
    • 2017-11-29
    • 2021-05-19
    相关资源
    最近更新 更多