Question

您好我正在建立一个画廊风格的网站，我对使用cssgrid.net的1140px网格非常感兴趣，因为我觉得960px对于这个项目来说太小了。

我想在第一行中分别有3个图像，每个图像有4列，然后是下面其余行的3个图像，每列3个。

问题在于，一旦我这样做，两行的右边缘就不会对齐，显然画廊看起来不会那么好。据我所知，这是由于在此网格中使用百分比构建列而导致的舍入。然而它仍然看起来很糟糕，我想让它们以某种方式对齐。这是什么解决方案？

要看到这种情况，您必须下载cssgrid.net网格

enter image description here

Answer 1

基于百分比的布局不是像素完美。我在我的一个项目中使用了css框架http://www.1140px.com/，我很满意。如果你想要像素完美的布局，你可以试试。

Answer 2

如果我理解发生了什么，这似乎是一个简单的错误。

您的占位符图片（猫）太小了。在此网格系统中使用占位符图像可能会非常棘手，因为您必须声明占位符所需的大小。实际上，在您的实际页面上，图像不会指定demensions，因为它会破坏网格系统（网格只会将图像缩小到适合您放入的列中的最大尺寸）。

总而言之，占位符图片太小了！在它们的全尺寸上，它们不会填满网格点，因此导致您描述的奇怪定位。话虽这么说，我总是放置至少1000px的占位符，以便它们可以正确缩小。

编辑：

尝试做基金会的工作：

.last {
float: right;
}

将其添加到样式表中 - 它应该对齐最后一列的右边缘。