背景なしでdiv内のイメージの位置を修正する方法はありますか？

Question

私は現在、Ruby on Rails環境で記事のビューを統合しています。 が、私はその中の記事の画像を設定し、それがこの

<div class="image_container> 
    <img src="/path/to/image.jpg" /> <!-- or <%= image_tag @article.image %> --> 
</div> 

のようになりますので、修正DIV 450px高さを作成したいとCSSは明らかにこの

.image_container{ 
    position: relative; 
    height: 450px; 
    overflow-y: hidden 
} 

.image_contianer img{ 
height: 100% 
position: fixed; 
} 

ようになり、それは私まで働いていました位置を固定に設定します。ここでは、ビューポートで固定され、divでは固定されません。

background-imageを直接HTMLで使用せずに画像を修正する方法はありますか？

EDIT

I作成したあなたたちは私が話しているかを理解できるようcodepen、それが要した時間のために申し訳ありません：

http://codepen.io/Drillan767/pen/rrKgyA

は、事前にありがとう

Answer 1

私は同じ効果を達成するためにdivをネストする解決策を持っています：

.image-container { 
    position: relative; 
    height: 400px; 
    overflow-y: hidden; 
} 

.image-container img { 
    position: absolute; 
    height: 100%; 
} 

.image-container-holder { 
    position: relative; 
    height: 100%; 
    overflow-y: scroll; 
} 
.my-child { 
    height: 40rem; 
    background: rgba(0, 0, 255, .5); 
    margin-top: 20rem; 
    margin-left: 5rem; 
} 

-

<div class="image-container"> 
    <img src="https://placekitten.com/g/1450/500"> 
    <div class="image-container-holder"> 
    <div class="my-child"> 
     Here 
    </div> 
    </div> 
</div> 

、私はまだそれがよりよい解決策になるbackground-position: fixedで動作するようになってと言うでしょうが、それは、それを解決します。

http://codepen.io/anon/pen/kkpKxY