CSS3 Box，如何停止自动调整内容大小？

Question

这是一个Fiddle，可以看到我的问题！ http://jsfiddle.net/h2Ya8/6/
与CSS how to fill remaining space (1 div with smaller divs)

相关

我只是在谷歌Chrome浏览器上使用/测试它，因为它将在使用谷歌浏览器的计算机上运行

我有10行，每6个盒子。这些盒子占用了所有可用空间 当我只放置适合盒子的内容时，它工作正常。但是当内容大于框可以处理的内容时，框会调整大小以适应内容。

无论放入什么内容，我都希望停止调整框的大小并始终保持不变 （目前我正在使用带有div的div但是我想用盒子替换它，因为它会自动填满可用空间，）

（我需要用图像和文字填充这些框）

Div的当前输出

Answer 1

我找到了解决方案！

行css中的

height:100%; 产品css中的width:100%

Fiddle显示了这一点！ http://jsfiddle.net/h2Ya8/31/

感谢您的帮助！

Answer 2

您只需指定整个页面具有特定大小：

 #page {
    width: 1024px;
    height: 768px;
}

如果你想要“方框”，<div class="product">这里有一个固定的大小，你应该为它设置CSS：

 .product {
    width: 100px;
    height: 80px;
    border: etc...;

Answer 3

您只需指定#page：overflow：auto。

的宽度和高度

即，

#page {
    width: 1024px;
    height: 768px;
    overflow: auto;
}