Flexbox

Flexboxなら下記のような並びも簡単に実装できます。

高さの異なる要素を、上下中央揃えできる
横並びになった要素の高さを揃える
要素を上下左右、並び替えられる
スペースの操作も簡単にできます。
■html

■css
.main a {
margin: 10px;
background: #cccccc;
color: #fff;
display: block;
padding: 10px;
text-decoration: none;
}
.main-nav {
display: flex;
}