相対位置に絶対配置要素が含まれていません

Question

何らかの理由で、画像が位置決め列内に含まれていません。私は両方のディスプレイをインラインで使用し、インラインブロックをimgで表示しようとしましたが、それでも動作しません。列は、相対位置のフレックスアイテムです。行は表示です：フレックス。

.row { 
    display: flex; 
    flex-direction: row; 
    flex-wrap: wrap; 
    width: auto; 
    /*margin-right: -1rem; 
    margin-left: -1rem;*/ 
    flex: 0 0 auto; 
    margin-bottom: 10px; 
    position: relative; 
} 


/* Column setup */ 

.col, 
.col-1, 
.col-2, 
.col-3, 
.col-4, 
.col-5, 
.col-6, 
.col-7, 
.col-8, 
.col-9, 
.col-10, 
.col-11, 
.col-12 { 
    box-sizing: border-box; 
    flex: 0 0 auto; 
    margin: 1% 0 1% 1.6%; 
    position: relative; 
} 

img { 
max-width: 100%; 
display: inline-block; 
position: absolute; 
} 

私の完全なコードへのリンクhttp://codepen.io/Limpuls/pen/bBbZmL

Answer 1

位置削除left: 0;

imgに

img{ 
max-width: 100%; 
display: inline-block; 
position: absolute; 
left: 0; /* <<< */ 
} 

Answer 2

を適用します。絶対に。 img divには画像が列の中にあります。 このようにする必要があります img {max-width：100％; display：inline-block;}