Align Content Vertically using CSS3 Transform
.container {
height: 100px;
background: #7396a1;
color: #fff;
width: 300px;
margin-left: auto;
margin-right: auto;
}
.content {
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
}
<div class="container">
<div class="content">I'm aligned vertically!</div>
</div>