scroll - 修复位置 : absolute element in a overflow: scroll element when scrolling

Question

我想使用 overflow: scroll(或 auto)完成比屏幕宽的图库预览。在右侧，与最后一张可见图像重叠的阴影应该表示右侧可以看到更多图像。

这是一个 fiddle :http://jsfiddle.net/SBdLg/

首先，我想:很简单，给那个图片库一个 box-shadow: inset。但这将在图像后面显示。现在，通过具有 position: absolute 的重叠 div，我达到了预期的效果，但是当向右滚动时 box-shadow 也会移动.

恕我直言，当使用包含阴影的图像而不是顶部的 div 时，也会出现此问题。

CSS 能否达到预期的效果？

Answer 1

从 outer DIV 中删除 position: relative 并将 shadow 精确定位在您需要的位置(这是丑陋的一点)将有所帮助你做到了。

查看演示:http://jsfiddle.net/SBdLg/11/