Question

我们如何将第二个div垂直居中。

<div style="text-align: center;" >  
    <div style=" width:50px; display:inline-block; "><b>This should come in center and</b>  
    </div>  
    <div style="display:inline-block; vertical-align:initial;"><b>this should be in same line BUT VERTICALLY CENTERED</b>  
    </div>  
</div>

非常感谢任何帮助感谢

更新： -
检查我的小提琴 - http://jsfiddle.net/linkmanishgupta/8SMLY/

Answer 1

对子div使用display:table-cell和vertical-align:middle，并为父div添加display:table和margin:auto。

.sub_div1{
  width:50px; display:table-cell; background:grey
}
.sub_div2{
  display:table-cell; background: aqua; vertical-align: middle
}

<强> UPDATED DEMO

Answer 2

我也不理解你的问题，但是：

请查看此代码：

<div style="vertical-align: middle;" >  
    <div style=" width:50px; background:red; display:inline-block;float:left "><b>This should come in center and</b>  
    </div>  
    <div style="display:inline-block; vertical-align:initial;line-height: 100px;"><b>this should be in same line BUT VERTICALLY CENTERED</b>  
    </div>  
</div>

Demo

垂直居中并在同一行 - HTML

2 个答案: