如何将图像垂直居中与CSS和HTML对齐？

我正试图在我的分区中垂直居中放置这些徽标。我该怎么做

以下是我的JSFIDLE：

这是我的HTML：

<div class="container-5col">
<div class="box-5col-1">
    <img src="http://cdn.gottabemobile.com/wp-content/uploads/2012/05/sprint-logo1-620x308.jpg" alt="Sprint" width="115" height="67" /></div>
<div class="box-5col-2">
    <img src="http://cdn-3.famouslogos.us/images/bank-of-america-logo.jpg" alt="Bank of America" width="179" height="30" /></div>
<div class="box-5col-3">
    <img src="http://www.underconsideration.com/brandnew/archives/Dell_Logo_Tagline.jpg" alt="Dell" width="92" height="94" /></div>
<div class="box-5col-4">
    <img src="http://www.unitedrentals.com/static/images/ur-logo.png" alt="United Rentals" width="146" height="39" /></div>
<div class="box-5col-5">
    <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/a0/Ford_Motor_Company_Logo.svg/2000px-Ford_Motor_Company_Logo.svg.png" alt="United Rentals" width="117" height="45" /></div>

---

更改

对齐内容：居中
的
对齐项目：居中

像这样：

.container-5col {
    display: flex;
    align-items: center;
}

您也可以通过IE 8支持的显示表来实现这一点+

css

这里有一个JsFiddle
可能的副本，我在你的每个div周围都加了一个边框，图像看起来已经垂直居中了。这没有什么区别
.container-5col {
    display: flex;
    align-items: center;
}

.container-5col {
    display: table;
}

    .container-5col > div {
        width: 20%;
        margin: 10px;
        padding: 10px;
        text-align: center;
        display: table-cell;
        vertical-align: middle;
    }