如何在Twitter Bootstrap中垂直对齐媒体正文内容? [英] How to vertically-align media-body content in Twitter Bootstrap?

问题描述

我希望 media-body 内容在垂直方向上居中.

I'd like media-body content to be vertically aligned 'middle'.

这是标记:

<div class="media">
  <a class="pull-left" href="#">
    <img class="media-object" src="..." alt="...">
  </a>
  <div class="media-body">
    I'd like this text to be vertically aligned 'middle'
  </div>
</div>

我尝试了以下无效的方法:

I've tried the following which doesn't work:

.media-body {
  vertical-align: middle;
}

知道我该怎么做吗?

推荐答案

引导: http://www.bootply.com/122430

HTML :

<div class="media">
  <a class="" href="#">
    <img class="media-object custom-media" src="..." alt="..." height="500px" width="500px">
  </a>
  <div class="media-body">
    I'd like this text to be vertically aligned 'middle'
  </div>
</div>

CSS :

.custom-media, .media-body{
  display:inline;
}

这篇关于如何在Twitter Bootstrap中垂直对齐媒体正文内容?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！