我正在使用WordPress制作一个响应式投资组合网站。我有一个小问题，破坏了布局。所有图片都是300px宽200px高。如果用户上传的图片大于上面提到的尺寸，我也会使用WordPress API来裁剪图片
add_image_size( "portfolio", 300, 200, true );
这对我来说是什么，它插入width="300"和height="200"属性的图像自动(但图像的原始尺寸保持不变，他们只是被调整大小)这工作得很好，除了当我试图调整我的浏览器窗口的大小。
下面是一个场景:客户端上传了一张尺寸为300px宽，210px高的图片。最初它是被调整大小和显示，因此布局是完美的，但当我调整浏览器的大小，图像也得到调整，但相对于其"原始尺寸"。因此，原始高度为210px的图像比其他图像大。当我浮动所有的图像，形成一个3栏的布局，高度的差异打破了布局(移动这个大图像下面的列到右边，并留下一个空列在自己下面)
如何解决这个问题?我想到使用timthumb来调整所有的图像显示之前。因此在飞行中改变图像的原始尺寸，但我认为这不是一个有效的方法?这个问题还有别的解决办法吗?我也不想使用任何像jQuery砌体，因为我有一个特定的布局维护。
谢谢
你可以使用css中的max-height规则来限制所有图像的高度。
,
.gallery img{
max-height: (some height);
}
使用%或em作为高度，像素在响应式设计中可能效果不佳。