水平對齊內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; 
}