0

我有一个固定宽度的基于 % 的网格（目前）。该代码基于这篇 css-tricks 文章：http ://css-tricks.com/dont-overthink-it-grids/

效果很好，直到我有一列包含多个相同大小的响应图像并且需要彼此相邻堆叠（浮动）。由于填充问题和其他问题，我无法让所有三个图像的宽度和高度都相同，尽管它们是以这种方式开始的。最后一个总是更高。这是一个显示问题的代码笔： http ://codepen.io/joshmath/pen/dEuIv

对此的任何帮助将不胜感激。我以前遇到过这个问题，但总是会根据具体情况来解决这个问题。谢谢！

4

2 回答 2

1

无论出于何种原因，如果您从最后一个元素中删除 padding-right: 0 样式，它就可以解决问题。

看起来您正在尝试使用填充在元素之间添加间距。我尝试使用 Chrome 开发工具代替的是使用边距而不是填充，然后将元素的宽度稍微减小到 29.5% 左右。这似乎奏效了。

于 2013-04-24T17:27:40.273 回答
0

只需将以下内容添加到您的 CSS 中。将大小设置为您喜欢的任何大小，并且网格中的所有图像都将保持该大小，如果它们需要增长/缩小，请改用高度/宽度百分比。

.grid img { 宽度：350px; 高度：400px；}

于 2013-04-24T17:27:47.193 回答