我正在为地产代理创建现有网站的响应版本。每个属性都有一个图像库，当图像是横向时可以很好地显示。问题是当他们是肖像时。
在原始代码中，图像大小定义为：
#gallery-images {
height: 577px;
overflow: hidden;
position: relative;
width: 828px;
}
我正在覆盖它（使用媒体查询）所以它变成
#gallery-images {
height: 205px !important;
left: 1px;
width: 290px;
}
但是，这意味着纵向图像是从顶部裁剪的，并导致显示不太理想 -请参见此处的示例。
如果我设置height:auto并且overflow:visible纵向图像显示正常，但对页面高度有负面影响。本质上，画廊导航保持在原位，但是当再次显示风景图像时，上面有很多空白空间。
一种选择是将画廊导航移动到图像上方并遭受下面的空白，但我想知道是否还有另一种我没有想到的解决方案。对于我可以进行的非 CSS 更改，我受到限制，但如果脚本可以提供更好的解决方案，也许可以说服客户添加一些内容。