Why is vertical-align: middle not working on my span or div?

This seems to be the best way – some time has passed since my original post and this is what should be done now:

.main {
  display: table;
  
  /* optional css start */
  height: 90px;
  width: 90px;
  /* optional css end */
}
        
.inner {
  border: 1px solid #000000;
  display: table-cell;
  vertical-align: middle;
}

<div class="main">
  <div class="inner"> This </div>
</div>