移动视图上水平滚动图库的问题

Question

我的摄影网站上有一个水平画廊的问题。 www.philippamichael.com

水平图库在计算机上查看时效果很好，所有图像的高度都相同。但是，在手机上查看时，图像尺寸各不相同？

以下是该问题的屏幕截图 -

仅当横向和纵向图像位于同一图库中时才会发生这种情况。任何人都可以告诉我为什么会发生这种情况，在代码中，图库和图像高度都设置为700px。

以下是水平滚动图库的CSS和HTML代码 -

    #scroll {
    margin-top:-2em;
    float: left;
    position: relative;
    width:100%;
    height:700px;
    overflow: auto;
    white-space: nowrap;
    overflow-x: auto; 
    overflow-y: hidden;
    -ms-overflow-y: hidden;
    }


 <div id="scroll">
 <img src="images/work/studio/nuno.jpg">
 <img src="images/work/studio/izabelle.jpg">
 <img src="images/work/studio/katie.jpg">
 </div>

我不是代码向导，所以也许有些东西我错过了或输错了？或者我可能需要额外的代码供移动使用？

感谢任何建议， 菲利帕

Answer 1

尝试为滚动条内的每个图像赋予固定高度。

#scroll img {
    height: 700px;
    width: auto;
}

让我知道它是否有效。