Вертикально выровняйте два изображения, используя выравнивание влево/вправо

Question

У меня есть левый div и правый div, и внутри этой цепочки этих двух divs я хочу, чтобы все divs были вертикально центрированы, и я работал в одной точке, подобной этой :

Теперь, однако, это выглядит следующим образом:

Единственное изменение, которое я сделал это я изменил "Дополнительная информация" б uttons от input тегов до img тегов с тегами a, так как я понял, что эти кнопки нужно переходить к другой цели. Вот HTML одной из строк:

<div class="centervertically"> 
       <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post"> 
        <div class="alignleft"> 
         <div class="leftInnerDiv featureh5"> 
          Front page app listing &nbsp;<b>$9.99</b> 
         </div> 
        </div> 
        <div class="alignright"> 
         <div class="rightInnerDiv"> 
         <input type="hidden" name="cmd" value="_s-xclick"> 
         <input type="hidden" name="hosted_button_id" value="PHV69C7ZY5GMG"> 
         <input type="image" src="http://www.appninja.io/images/addtocart.png" width="130" height="43" border="0" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!"> 
         <a href="marketing.html" target="_blank"><img src="http://www.appninja.io/images/moreinfo.png" width="130" height="43" border="0" border="0"></a> 
         <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1"> 
        </div>   
        </div> 
       </form> 
      </div> 
      <div style="clear: both;"></div> 

А вот CSS, связанные с ним:

.centervertically, 
.alignleft, 
.alignright{ 
    height: 60px; 
} 

.alignleft:before, 
.alignright:before{ 
    content: ""; 
    display: inline-block; 
    vertical-align: middle; 
    height: 100%; 
} 

.leftInnerDiv, 
.rightInnerDiv{ 
    vertical-align: middle; 
    display: inline-block; 
    position: relative; 
} 

.alignleft { 
    float: left; 
} 
.alignright { 
    float: right; 
} 

.featureh5 { 
    font-size: 100%; 
    font: inherit; 
    font-size: 20px; 
} 

Answer 1

Ваш a тег рядный. Вы должны поставить display: inline-block и vertical-align: middle.