为什么网格单元高度不考虑图像？只有 Html 和 CSS

Question

我正在尝试让一个小描述卡从网格内 div 中的图像后面弹出。我的过渡效果很好，但我需要将卡片放在图像后面，所以我在 CSS 中替换了描述卡，如下所示：

.description_card{
    margin-top: -100%;
}

当我这样做时，它使 div 高度大小相对于卡片的垂直位置，导致其后面的图像溢出 div，被网格的溢出规则隐藏。注释掉描述卡使网格高度与图像高度匹配。

我想要的是 div Hight 仅由图像高度决定，而不受任何描述位置的影响。我只能使用 html 和 CSS。

我尝试向与卡片位移具有相同相对大小的 div 添加底部填充，期望这能够补偿 div 底部的位移。这确实防止了溢出，但填充比预期的要远。随着页面变窄，填充会增加，访问最终会变得比图像更大，从而使页面比应有的长度长得多。

Answer 1

欲了解更多信息，请给我 HTML。但通常这种类型的问题是因为你没有定义你的 div 的高度。

请发送 HTML 以获取更多信息。