How to adjust image to fit the device in card


#1

Here is the main part of the code in the view

          <div class="card">
        <div class="item item-divider item-text-wrap">
          some text
        </div>
        <div class="item item-image">
          <button ng-click="doVote(1)">
            <img src="images/button.png" class="turn-img">               
          </button>
        </div>
      </div>

And here is the style for the class trun-img

.turn-img {
max-width:100% !important;
height:auto !important;

}
where the size of button.png is quite big.

With the code above, the button.png image does not scale to fit , but is partly shown on my device (android 4.0.4).


#2

what about using, button?
for example

<button calss="item item-image button button-full"><img></button>

can work?