保持浮动跨度valign中间

Question

我已经尝试了很多来保持 span valign 居中。目前它看起来像：

但我想要那个：

你可以在这里玩：Link

Answer 1

.wrapper{
  display:table-row;
}

.image-left{
  width:50px;
  height:50px;
  background-color:grey;
  }

.text-block{
  display:table-cell;
  vertical-align:middle;
}

<div class="wrapper">
  <div class="image-left">
  </div>
  <div class="text-block">
    <span>One does not simply css.</span>
  </div>
</div>

每当我需要对齐文本时，我倾向于在 span 的父元素或文本所在的 div 上使用 display: table-cell 和 vertical-align:middle。

但实际上有很多方法可以实现这一目标。我建议你谷歌一下，看看哪一个最适合你的情况。我只是更喜欢表格单元格，因为它们会自动调整到行中的所有内容，并且看起来很干净。

详细信息：http://phrogz.net/css/vertical-align/

顺便说一句，您的链接无效。