CSS: bottom alignment text with material icons

Question

I've been struggling for a correct alignemt between two icons and a small text but I cant manage to properly align them:

I need the text to be align with both icons, can someone give me a help; i've checked a very similar post but I couldn't make it work.

.icon-company-title {
  margin-top: 30px;
}

.material-icons.md-18 {
  color: $primary;
  font-size: 40px;
  line-height: 0!important;
}

.material-icons.edit {
  color: $primary;
  vertical-align: middle;
}

.business-icon {
  display: inline-block;
  vertical-align: bottom;
}

<div class="icon-company-title">
  <div class="business-icon">
    <i class="material-icons md-18">business</i>
  </div>
  <span class="company-card-title">{{ entity.name }}</span>
  <button class="" mat-icon-button [matMenuTriggerFor]="menu">
            <i class="material-icons edit">mode_edit</i>
          </button>
</div>