Html 垂直与右-左div对齐

我有两个div，一个在左边，一个在右边。如果左侧的描述比图像（180px）长，则图像保持在顶部。反之亦然，如果文本比图像短，则比要在顶部对齐的文本短

我希望两者始终在中间对齐

我想我需要的是

display:table cells

，然后

vertical align:middle

，但到目前为止，我还没有成功实现这一点

  <div class="span4">
   <img class="thumbnail" src="http://placehold.it/290x180" width="290" height="180" alt="Second function" />
  </div>
  <div class="span6 offset1">
    <h3>Element</h3>
    <p>Description.</p>
  </div>

元素
描述

开始关注以下内容：

将此处提到的一些样式元素应用于此处：

一旦我把高度值放在单独的div中，它就让描述空间居中，而不是放在一个只适合放进去的盒子里

希望这个问题不要太晚。这似乎是一个常见的问题

.span4 {
  float:left;
}
.span6{
  height:180px;
  width:100px;
  vertical-align:middle;
  display:table-cell;
  border:1px solid blue;
}
.containerspan {
  border:1px solid green;
  height:200px;
  display:table-cell;
  vertical-align:middle;
  text-align:center;
}

---

当时我正在寻找一个没有固定高度和宽度的解决方案，如果我没记错的话，但仍然值得一试，谢谢！