css - Ionic: stretch image in card to device width -

i using ionic framework. trying stretch image in card match device width.

based on example here, here code far.

<div class="list card">    <div class="item item-avatar">     <img id="myimg" src="http://lorempixel.com/50/50/people">     <h2>pretty hate machine</h2>     <p>nine inch nails</p>   </div>    <div class="item item-image" id="image-container">     <img src="http://lorempixel.com/400/400/sports">   </div>    <a class="item item-icon-left assertive" href="#">     <i class="icon ion-music-note"></i>     start listening   </a>  </div> 

css

.item-image img:first-child {   position: relative;   width: 100vw !important;   left: calc(-50vw + 50%); } 

here pen created share.

the question referred on so.

any appreciated !!!

i added these few lines css desired outcome:

add my-card class card , then,

.my-card .item.item-image{   width: 100vw;   margin-left: -10px; }  .my-card.card{   overflow: visible; } 

basically, made overflow visible on card, , adjusted card's margins.

here working fork of pen !!!