css - 更少的条件填充？

Question

也许条件填充不是要走的路，但是 -

我有一个包含的 div，如果可以的<img>话，它应该填满可用的垂直空间（90px），否则它应该垂直居中。这是一个演示问题的小提琴：

我怎样才能使用 LESS / CSS（不是 JS）来完成这个？

// code for image
.folder-box img {
    max-height: 90px;
    max-width: 100%;
}

score 1 · Accepted Answer

如果我理解正确，这是一个简单的 CSS 问题，可以通过使用垂直居中来解决：

我添加的唯一样式是图像样式：

.folder-box img {
    top: 0; left: 0; bottom: 0; right: 0;
    position: absolute;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
}

如果您需要为您的标题元素定义空间，您可以简单地将图像包装到另一个容器中并设置padding-bottomand position: relative.

1 回答 1