如何垂直对齐图像旁边的文本与骨架网格

Question

我正在尝试将图像与THIS PAGE上“顾问委员会”标签上的文字垂直对齐。

缩短html：

<div class="four columns alpha"><img class="ImageBorder" src="LINK" alt="" /></div>
<div class="twelve columns omega">
<p class="padding">TEXT</p>
</div>
</div>

我尝试了一些提出的多行解决方案HERE，但无法正确排列文本/图像。有一个很好的方法来使用网格系统吗？

谢谢！

Answer 1

以下是您需要添加的内容：

.omega{
   display: inline-block;
   float: none;
   margin-left: 0;
   vertical-align: middle;
}

.alpha{
  display: inline-block;
  float: none;
  vertical-align: middle;
}