Hi, I’ve currently taken code from the tutorial to display a card with an image in the middle.
<ion-content scroll="false" has-header="true" padding="true" > <div class="card"> <div class="item item-avatar"> <!--<img src="avatar.jpg">--> <h2>Pretty Hate Machine</h2> <p>Nine Inch Nails</p> </div> <div class="item item-image" style="height: auto"> <img class="" src="images(red)/00_Fool.jpg" > </div> <a class="item item-icon-left assertive" href="#"> <i class="icon ion-music-note"></i> Random Comment </a> </div> </ion-content>
I’m finding though that if the image is large, it will cause the content to start scrolling.
What I rather want is for the image (preferably the middle div that contains it) to automatically resize itself so that the entire card never starts scrolling, so that the entire card can be seen from the screen.
Any ideas how to go about this? Putting height:100% on div class=“card” along with height:auto on the middle div (as shown in above code) isn’t working.