div网格，动态重新缩放

Question

我想获得以下布局：

[ ][ ][ ][ ][ ][ ]
[ ][ ][ ][ ][ ][ ]
[ ][ ][ ][ ][ ][ ]
[ ][ ][ ][ ][ ][ ]

其中每个[ ]最多应为300x150像素，但缩小为 根据需要设置边界框，保留纵横比。

.field {
    width: 16%;
}

.field .placeholder{
    float: left;
    width: 300px;
    height: 150px;
}

我尝试在div中添加占位符div，但事实并非如此 真的很有帮助，它给了我一些类似于

的东西

[ ]
[ ]
[ ]
...

Answer 1

尝试使用max-width和max-height css属性，并将宽度和高度设置为某个百分比。

Answer 2

你在寻找什么？

http://jsfiddle.net/codef0rmer/mNkEj/

Answer 3

看起来桌子就是我需要的。

td { width: 1%; }

水平相同，但我仍然有垂直间距的问题。