html - 行数影响方框位置

Question

我遇到了行数影响框位置的问题。我拥有的行越多，它显示的越差。

我正在使用的 HTML

<div class="block">
    <img alt="*" src="http://placekitten.com/200/300" alt="*" />
    <h2>Nameasdasd asd asdf wsd fgW</h2>    
</div>

和 CSS

.block
{
    width: 120px;
    height: 150px;
    display: inline-block;
    border-radius: 10px;
    margin: 13px 13px 0 0;
    text-align: center;
    padding: 5px;
    position: relative;
    behavior: url(/Media/PIE.htc);
    cursor: pointer;
    background: #f00;
}

.block img { height: 70px; width: 70px; display: block; margin: 0 auto 10px auto; }
.block h2 { font-size: 12px; padding: 0; margin: 0; font-family: 'Arial'; }

fiddle :http://jsfiddle.net/3GVTK/2/

我以前从未遇到过这个问题。

编辑:感谢所有回复和解决方案!所有这些都是有效的并且有效(截至目前)。我将坚持使用 Blazemongers 解决方案，因为它对当前布局没有任何副作用。

Answer 1

将 vertical-align: top; 添加到您的 .block 元素的 css。

http://jsfiddle.net/mblase75/tsRKG/

如果您在宽屏幕上查看 fiddle 的 block ，您可能会注意到它们与最后一行文本对齐。这就是 baseline 的意思，也就是 default vertical alignment .