如何在可點擊圖像的中間垂直對齊（之間 <a></a> ）內的div以響應方式？

Question

題：

我在div中有兩個可點擊的圖像。 如何在中間垂直對齊它們？

---

我嘗試過的是：

• 如何在div中垂直對齊圖像

• 將div內的圖像與響應高度垂直對齊

---

碼：

的CSS

.accounts {
    height: 90%;
    width: 100%;  
    margin: auto;
    text-align: center;
    font: 0/0 a;
}

.accounts:before {
    content: ' ';
    display: inline-block;
    vertical-align: middle;  /* vertical alignment of the inline element */
    height: 100%;
}

.accounts a {
    width: 30%;
/*    margin: 20% 5% 0% 5%;*/
    display: inline-block;
    vertical-align: middle;
    font: 16px/1 Arial sans-serif; 
}

.accounts a img {
    width: 100%;
}

的HTML

<div class="accounts">
   <a href="LinkA" target="_blank"><img src="Vendors/Images/GithubLogo.png" alt="Github"></a>
   <a href="LinkB" target="_blank"><img src="Vendors/Images/SOLogo.png" alt="Stack Overflow"></a>
</div>

Answer 1

這樣使用

    <div class="accounts">
        <a href="LinkA" target="_blank"><img src="Vendors/Images/GithubLogo.png" alt="Github"></a>
   </div>
   <div class="accounts">
        <a href="LinkB" target="_blank"><img src="Vendors/Images/SOLogo.png" alt="Stack Overflow"></a>
    </div>