css中让元素居中

做ionic项目，遇到个问题。如下，要让span在ion-card中垂直居中。
核心：子元素设置 line-height等于父元素的height。
效果图：

  <ion-card class="me-card-tel">
        <span class="phone">手机号</span>        
  </ion-card>

//下面是css

.me-card-tel {
        margin: 0;
        width: 100%;
        height: 40px;
        padding-left: 3%;
        padding-right: 3%;
    }
    .phone {
        float: left;
        line-height: 40px;
        font-size: 135%;
        margin: 0;
    }