位置：仅在高度固定(position: fixed only on height)

我正在此网页上： http://jsfiddle.net/Saturnix/4RzyG/embedded/result/

代码是在这里： http://jsfiddle.net/Saturnix/4RzyG/

它的工作原理在Safari /火狐/ Chrome和其他浏览器得体罚款。 然而，随着移动Safari浏览器打开它时和捏（zomming中）一些奇怪的事情发生了。

正如你所看到的，文字在页面的底部消失：这样做是由于与中央div的底部采用透明PNG图像。 他们都是由占据相同的空间和处理窗口大小而不是移动Safari浏览器缩放。

这是有道理的，如果你读代码：底部梯度（PNG图像）使用position: fixed住总是在页面的中心，但是，只要你“捏”的Safari移动，它会永远留在中央。

我想的位置被固定仅在元件的高度（否则滚动PNG图像时会从底部分离），但不为宽度。 这可能吗？ 你将如何更改代码，使其在iOS工作？

这是控制文本的CSS代码淡出通过将PNG图像

.bottom_fade_center {
            position: fixed;
            bottom: 0;

            width: 80%;
            left: 10%;

            background: url("bottom-fade.png");
            background-repeat:repeat-x;
            height: 400px;
            pointer-events:none;
            z-index: 3;

            }

提前致谢！

文章来源: position: fixed only on height