水平对齐内div元素在顶部

Question

我想水平对齐这些元素：

<div class="row"> 
    <div class="block">xxxxx</div> 
    <div class="block">xxxx</div> 
    <div class="block">xxx</div> 
    <div class="block"><select multiple></select> 
</div> 

.row { 
    width: 100%; 
    /*margin: 0 auto;*/ 
    text-align: center; 
} 
.block { 
    width: 100px; 
    /*float: left;*/ 
    display: inline-block; 
    zoom: 1; 
} 

然而，我与以前的代码中看到的输出是：

   divS 
       divS 
div1 div2 div3 divS 

我想找到一种方法将前三个div与选择的顶部对齐，而不是与底部对齐。

div1 div2 div3 divS 
       divS 
       divS 

这可能吗？

Answer 1

将vertical-align:top增加到.block class。请让我知道你是否想要这个。

.block { 
    width: 100px; 
    /*float: left;*/ 
    display: inline-block; 
    zoom: 1; 
    vertical-align:top; 
} 
.row { 
    width: 100%; 
    /*margin: 0 auto;*/ 
    text-align: center; 
}