在其列中间垂直对齐文本的最佳/正确的方法是什么？图像高度静态设置在CSS中.
我已经尝试设置一个外部div来显示：table和一个内部div来显示：table-cell with vertical-align：middle,但是也不起作用.
<section id="browse" class="browse">
<div class="container">
<div class="row">
<div class="col-md-5 col-sm-5">
<h2 class="text-left">Link up with other gamers all over the world who share the same tastes in games.</h2>
</div>
<div class="col-md-1"></div>
<div class="col-md-6 col-sm-7 animation_container">
<img id="animation_img2" class="animation_img animation_img2" src="images/section2img2.png"/>
<img id="animation_img1" class="animation_img animation_img1" src="images/section2img1.png"/>
</div>
</div>
</div>
</section>
CSS
.browse .container,.blind_dating .container { padding-bottom: 0; }
.animation_container { position: relative; }
.browse .animation_container { height: 430px; }
.animation_img { position: absolute; bottom: 0; }
.animation_img1 { right: 25%; }
.animation_img2 { right: 25%; }
解决方法
HTML：
首先,我们需要在文本容器中添加一个类,以便我们可以相应地访问和编辑它.
<div class="col-xs-5 textContainer">
<h3 class="text-left">Link up with other gamers all over the world who share the same tastes in games.</h3>
</div>
CSS：
接下来,我们将应用以下样式来垂直对齐,根据它旁边的图像div的大小.
.textContainer {
height: 345px;
line-height: 340px;
}
.textContainer h3 {
vertical-align: middle;
display: inline-block;
}
全做完了！如果您认为它仍然略微偏离对齐,请调整上面样式的线高度和高度.
