发生溢出时将图片放入表格单元格并水平滚动

Question

我有以下 html 表格片段：

<td>
<div>

    <a class="fancy_image" href="/owner/createCompany/getOriginalImage/3" title=""><img class="image-lis-in-table-cell" src="/owner/createCompany/getMediumThumbnail/3" alt=""></a>

    <a class="fancy_image" href="/owner/createCompany/getOriginalImage/1" title=""><img class="image-lis-in-table-cell" src="/owner/createCompany/getMediumThumbnail/1" alt=""></a>

    <a class="fancy_image" href="/owner/createCompany/getOriginalImage/5" title=""><img class="image-lis-in-table-cell" src="/owner/createCompany/getMediumThumbnail/5" alt=""></a>

    <a class="fancy_image" href="/owner/createCompany/getOriginalImage/2" title=""><img class="image-lis-in-table-cell" src="/owner/createCompany/getMediumThumbnail/2" alt=""></a>

    <a class="fancy_image" href="/owner/createCompany/getOriginalImage/4" title=""><img class="image-lis-in-table-cell" src="/owner/createCompany/getMediumThumbnail/4" alt=""></a>

</div>
</td>

看起来像这样：

当我在表格单元格tr 中有超过 2 张图片时，高度会发生变化。它看起来很丑。我希望只在一行内渲染图片，如果图片太多我想滚动查看。

可以提供我想要的样式。

Answer 1

.image-lis-in-table-cell {
       margin: auto;
       white-space: nowrap;
       width: 100%;
       overflow:auto; }

如果你需要更多，那么你可以使用任何 overflow-x:scroll 或 overflow-y:scroll;