Align text and image inside button

Question

So i need to create a LIKE button. But i can't make my text and image aligned by middle center. +this % responsivness is dravin me crazy.

Maybe im doing something too hard and someone can rewrite easier and explain to me. But i want the button to scale with % so responsive.

This is what i want

This is what i have at the moment

    .kom_augsha .treshais{
    	width:15%;
    	float:right;
    }
    
    .reitings{
      display:table;
      width: 100%;
      border: 1px solid #e9e9e9;
      
    }
    
    .rate {
      display: table-cell;
      text-align: center;
      vertical-align:middle;
      line-height: 1.5em;
    }
    
    .plus {
      background: white;
      color: green;
    }
    
    .minus{
      background: white;
      color: red;
      border-left: 1px solid #e9e9e9;
      padding-left:10px;
      text-align:center;
    }

<div class="treshais">
  <div class="reitings">
    <div class="rate plus"><img src="plus.jpg"/>83</div>
    <div class="rate minus"><img src="minus.jpg"/>9</div>
  </div>
</div>

Answer 1

You can use this:

.rate img {vertical-align: middle;}