HTML/CSS：在iPad上從動態內容到背景的漸變過渡。見活生生的例子

Question

下面是一個例子，我目前如何實現此功能：

EXAMPLE

內容的div可以在高度動態改變項目時添加或刪除，所以我需要的梯度和它一起移動。這在桌面瀏覽器中效果很好......但是，當您在iPad上查看它並向下滾動（向上移動整個身體）時，由於位置的原因，它看起來很奇怪：固定在漸變div上。請注意，當內容div小於視口時，這只是一個問題。如果內容div大於視口，它會將漸變推出視圖，效果很好。

有什麼辦法可以防止iPad像這樣移動身體，還是有更好的方式來實現這個功能，而不使用position：fixed？

謝謝！

Answer 1

你能解釋一下在iPad上看起來有什麼問題，我沒有一個與我在一起。此外，我刪除了位置：固定;並且功能在Chrome上沒有改變。靜態和相對工作對我來說是一樣的。

Answer 2

我拋棄了梯度的div和而不是在與梯度的具有以下性質的背景圖像的內容的div設定的最小高度：

#content { 
    min-height: 200px; 
    background-color: white; 
    background-image: url(../Images/content-background.png); 
    background-position: center bottom; 
    background-repeat: repeat-x; 
}