Currently utilizing the ionic framework and attempting to expand the image within the card to fit the device width.
Referencing the example provided here, here is my current code progress.
<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%);
}
Providing a link to the pen I created for sharing here.
For additional information, I found this question on SO helpful here.
Any assistance or insights would be greatly appreciated!