css - 更少的条件填充？

Question

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

我有一个包含 <img> 的 div , 如果可以的话，它应该填满可用的垂直空间 (90px)，否则它应该垂直居中。这是演示问题的 fiddle :

http://jsfiddle.net/PTSkR/165/

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

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

Answer 1

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

Example Fiddle

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

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

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