css滚动条的问题

我有一个css滚动条的工作方式，我需要他们的问题。我有一个通过ajax提取JPG图像的模式页脚。我有3个

div

元素，在模式页脚中并排排列，每种类型的照片对应一个

我希望所有的照片在各自的div中水平流动，只有在需要时才使用水平滚动条，而根本没有垂直滚动条。图片每幅为75x75像素。我有以下代码：

<div class="modal-footer">
            <div id="photodiv" class="pull-left" style="padding:0px 2px; max-width:300px; max-height:80px; overflow: auto; border:1px solid gray;">
                <div id="photoProgress" class="progress progress-striped active">
                    <div class="bar" style="width:100%;"></div>
                </div>
                <div><h3>Looking for photos...</h3></div>
            </div>
            <div id="notePhotoDiv" class="pull-left" style="padding: 0px 2px; max-width: 300px; max-height: 80px; overflow: auto; border: 1px solid gray;">
                <div id="noteProgress" class="progress progress-striped active">
                    <div class="bar" style="width:100%;"></div>
                </div>
                <div><h3>Looking for progress notes...</h3></div>
            </div>
            <div id="pathPhotoDiv" class="pull-left" style="padding: 0px 2px; max-width: 300px; max-height: 80px; overflow: auto; border: 1px solid gray;">
                <div id="pathProgress" class="progress progress-striped active">
                    <div class="bar" style="width:100%;"></div>
                </div>
                <div><h3>Looking for path reports...</h3></div>
            </div>
            <p>
                <input class="btn btn-primary" type="button" id="save" value="Save" />
                <input class="btn btn-secondary" type="button" id="cancel" value="Cancel" />
            </p>
        </div>

正在寻找照片。。。
正在查找进度说明。。。
正在查找路径报告。。。

我尝试过以各种不同的方式更改溢出属性，但似乎无法使其正常工作

我尝试过调整溢出x、溢出y、溢出，我尝试过从自动更改为隐藏、滚动、可见

---

代码当前只有垂直滚动条。有人能给我指一下正确的方向吗？不幸的是，我不能提供JSFIDLE，因为它是用于内部网站的，并且正在从内部服务器提取照片。如果需要，我可以提供它的屏幕截图。

我想我得到了你想要的。问题是您可能需要

空白：nowrap

将图像保留在一行中，而不是换行到下一行。请参见此示例：

---

因此，您需要三个并排的div，并且在每个div中，您需要通过水平滚动条滚动图像。对吗？