位置在兩個單獨的div的頂部和底部

Question

我想淡出兩個獨立的div的頂部和底部。

現在我正在嘗試使用position：absolute和top：頂部1px和底部1px：底部1px。是不是爲我工作，使用父div？這是導致他們出現在錯誤的地方。

這撥弄顯示了我：

http://jsfiddle.net/mstefanko/23mfk/

我想是每個div的頂部和底部都在撥弄證實淡入淡出。

Answer 1

您的.inner-1和.inner-2都具有絕對定位元素。這些元素被定位在與視口相關的位置，而不是他們的父級。你需要設置.inner-1和.inner-2的相對位置：

.inner-1, 
.inner-2 { 
    position: relative; 
} 

這將導致漸變元素出現在這些容器的頂部和底部。

演示：http://jsfiddle.net/23mfk/1/