CSS浮动/内联块问题

Question

• 您可以检查一下jsFiddle吗？
• 调整“结果”框架的宽度。
• 请注意，框的布局在2列和3列之间切换。

我想让布局看起来像这样并且即使在调整窗口大小时也可以保持这样的毛刺：

_________
| ▄ ▄ ▄ |
| 1 2 3 |
| ▄ ▄ ▄ |
| 4 5 6 |
¯¯¯¯¯¯¯¯¯

您可以更改HTML / CSS来完善布局并摆脱故障吗？

提前致谢！

Answer 1

http://jsfiddle.net/znPGj/3/通过在img框上以px为单位设置高度来修复它

Answer 2

检查以下示例http://jsfiddle.net/sandeep/znPGj/4/ css：

a {
    float:left; 
    width: 33%;
    margin: 0;
    padding: 4px 0;
    color: #000;
    font: medium sans-serif;
    text-align: center;
}
a:nth-child(4){clear:both}
img {
    width: 80%;
}

Answer 3

你可以包装所有的img在一个div并设置特定width的div

示例： http ： //jsfiddle.net/jasongennaro/znPGj/5/

Answer 4

您是否尝试过将宽度降低到32％？ 为我工作，但是我没有在许多浏览器上进行测试。