在960.gs div中垂直对齐图像？

Question

我正在使用960.gs，并希望垂直对齐IMG。我的感觉是 grid_3的第一个DIV内的IMG不知道它的高度 行的其余部分（grid_6 suffix_3的div）。图像拥抱顶部...

一些限制：我可能不知道图像的高度。我可能不知道 DIV内容的高度在右边。

不使用javascript，什么是不会打破960.gs的好方法？ 这是我去嵌套容器的地方，只是为了让我可以垂直居中 IMG？我尝试过css规则：

img {
    vertical-align: middle;
}

显然还有更多......

Snippet...

    <div class="container_12">
            <div class="grid_3">
                    <img src="images/dlsmug5.png">
            </div>

            <div class="grid_6 suffix_3">
    <h1>My Title - etc...</h1>
    <p>
               Heya, revamp time!  It may not be obvious, but...,
               I am coming up to speed with the CSS framework
               of <a href="http://960.gs">The 960 Grid System</a> ..
    </p>
            </div>

            <div class="clear"></div>

Answer 1

您可以使用垂直对齐方式向div提供表格单元格行为：

.grid_3 {
    display: table-cell;
    vertical-align: middle;
}