html - 适应屏幕尺寸的自适应缩略图div

我有一个缩略图列表，当您调整浏览器屏幕的大小时，它们都可以很好地适应并且保持相同的高度和宽度。

我需要在没有图像的情况下添加缩略图，并带有居中图标，但是当我调整浏览器大小时，div不会以与图像相同的方式扩展。

这是为移动屏幕设计的，但是我希望它具有与图像相同的行为。

我在代码中缺少什么，即时通讯猜测它的CSS问题与高度或边距/百分比值有关？

我有一个包含所有代码的演示：-

http://jsfiddle.net/zM5SG/1/

.gallery li a.addImage {
display: block;
margin: 7px 5px 0 5px;
border: 1px dotted #aaa;
background-color: #ddd;
min-height: 58px;
}

.test{
   background: url("http://icons.iconarchive.com/icons/custom-icon-   design/mini/24/Delete-icon.png") no-repeat scroll /*1px -109px*/ center transparent;
   display: block; width:24px; height:24px; text-align:center;
   margin: 0 auto;
   margin-top: 15%; margin-bottom: 15%;
}

任何帮助将非常感谢。

最佳答案

我知道这不是最优雅的方法，但是您是否不能只用看起来空白的图像替换“空白”？所以它会和其他图片一样调整大小吗？

关于html - 适应屏幕尺寸的自适应缩略图div，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18099145/