垂直对齐固定高度div中的图像

Question

我已经搜索了高低的知识库，但似乎没有什么能给我一个结果。

我附上了我正在处理的内容的截图和代码，但我需要做的是根据最高图像创建的div的高度垂直对齐图像。

所以，一些事情。 容器.one-edition的固定高度由最高的图像大小决定 - 我可以用JS做到这一点吗？

然后，一旦确定了高度，图像就在中间垂直对齐。

希望这是有道理的。

    <div class="grid_3 one-edition">
<a href="product-1.php"><img src="images/editions/1_Right_To_Buy_295.jpg"></a>
        <div class="editions-info-text">
            <p>Right To Buy</p>
            <p>C-type Print</p>
        </div>  
    </div>
    <div class="grid_3 one-edition">
        <a href="product-1.php"><img src="images/editions/2_Scorer_295.jpg"></a>
        <div class="editions-info-text">
            <p>Hyperbolic Paraboloid Roof</p>
            <p>Offset Print</p>
        </div>  
    </div>
    <div class="grid_3 one-edition">
        <a href="product-1.php"><img src="images/editions/3_PL16_295.jpg"></a>
        <div class="editions-info-text">
            <p>132Kv PL16</p>
            <p>Offset Print</p>
        </div>  
    </div>
    <div class="grid_3 one-edition">
        <a href="product-1.php"><img src="images/editions/4_What_We_buy_295.jpg"></a>
        <div class="editions-info-text">
            <p>What We Buy</p>
            <p>Publication</p>
        </div>  
    </div>

Answer 1

我已经看到很多答案，但我仍然发布这个，因为我花时间使用placekittens ..

http://jsfiddle.net/7ybzp/6/

基本上，我使用vertical-align: middle 。 我虽然使用了inline-block 。