HMTL and CSS - Vertical Alignment

Using CSS to vertically align can be tricky. Here are some situations and the solution that allowed for vertical alignment.

Angular ui-grid and vertically aligning an anchor within a cell:

columnDefs: [{ name: ' ', cellTemplate: '<a href=""

  ng-click="grid.appScope.viewBatch(row.entity)">View</a>',

  cellClass: 'grid-align', width: "6%" },

CSS:

.grid-align {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center; /* horizontal part */
}

Align span and input within div: