将网格垂直放置在中心位置？

Question

如何将它垂直放置在中心？

<div class="ui-grid-b">
    <div class="ui-block-a">Block A</div>
    <div class="ui-block-b">Block B</div>
    <div class="ui-block-c">Block C</div>
</div>

Answer 1

使用vertical-align属性。

div[class|=ui-grid] { 
    background: red;
    text-align: center;
    padding: 30px; }
div[class|=ui-block] { 
    background: blue;
    font: 10px Verdana;
    color: #fff;
    padding: 10px;
    vertical-align: middle;
    display: inline-block; }
.ui-block-a { height: 100px; }
.ui-block-b { height: 50px; }
.ui-block-c { height: 200px; }

div[class|=ui-grid]和div[class|=ui-block]正在使用attribute selector。

预览：http://jsfiddle.net/Wexcode/LzuYR/