兩個欄佈局，只有一列滾動

Question

我需要創建一個兩列布局，其中：

1. 左列具有填充整個區域的圖像;
   此列中的內容不可滾動。

2. 右欄有文字和圖片。 該列的內容在長時間內可滾動。

所以，當我移動瀏覽器的滾動條正確的內容移動，但在圖像上左列保持不變，並填充整個區域。

這可能嗎？

這是我的時刻：

body{ 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
.left, .right { 
 
    float: left; 
 
    width: 50%; 
 
} 
 

 
.left img { 
 
    height: auto; 
 
    max-width: 100%; 
 
    outline: 0; 
 
}

<div class="left"> 
 
    <img src="image.jpg" /> 
 
</div> 
 
<div class="right"> 
 
    <p>Long content</p> 
 
</div>

Answer 1

使用position:fixed爲右DIV左格和padding-left:50%。

小提琴：​​