对齐按钮

Question

所以我需要创建一个LIKE按钮。但我不能让我的文字和图像由中间中心对齐。 +这个％的责任感让我疯狂。

也许我正在做一些太难的事情，有人可以更轻松地重写并向我解释。但我希望按钮按％缩放以便如此响应。

这就是我想要的
这就是我目前所拥有的

    .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

您可以使用：

.rate img {vertical-align: middle;}

Answer 2

.rate img {
    vertical-align: middle;
    display: inline-block;
}