Div такой же ширины, как и другой div, но отзывчивый

Question

Я хочу растянуть мой img внутри div до той же ширины, что и другой div, который выше в иерархии.

<div> 
    <div> 
    <div> 
     <div> 
     <img></img> 
     </div> 
    </div> 
    </div> 
</div> 

IMG должен иметь такую ​​же ширину, как и в большинстве верхней DIV (но это DIV не подходит весь экран). Я знаю, что это возможно сделать с абсолютной позицией, но я хочу, чтобы она была отзывчивой. Невозможно переместить img, потому что это php.

Answer 1

Вы всегда можете сделать DIV вы хотите, чтобы изменить размер изображения, чтобы relative positioned и сделать изображение absolute positioned ...

.biggest { 
 
    position: relative; 
 
    height: 500px; 
 
    width: 100%; 
 
    border: solid 2px red; 
 
} 
 
div { 
 
    width: 50%; 
 
    border: solid 2px blue; 
 
    height: 100px; 
 
} 
 
img { 
 
    position: absolute; 
 
    width: 100%; 
 
}

<div class="biggest"> 
 
    <div> 
 
    <div> 
 
     <div> 
 
     <img src="http://lorempixel.com/g/400/200"> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>