如何垂直对齐图中的figcaption

Question

如何垂直对齐图中的文字与图中的图像。

参见：http://jsfiddle.net/YdATG/1/

HTML

<section class="links"> 
    <a href="#"> 
    <figure class="grid-parent clearfix"> 
      <figcaption class="grid-80 push-20 fontEmphazie">foo</figcaption> 
      <img alt="Foto" src="http://www.google.com/intl/de/homepage/images/google_favicon_64.png" class="grid-20 pull-80 grid-no-pad-left grid-no-pad-right"> 
    </figure> 
    </a> 
    <a href="#"> 
    <figure class="grid-parent clearfix"> 
       <figcaption class="grid-80 push-20 fontEmphazie">bar</figcaption> 
       <img alt="Foto" src="http://www.google.com/intl/de/homepage/images/google_favicon_64.png" class="grid-20 pull-80 grid-no-pad-left grid-no-pad-right"> 
    </figure> 
    </a> 
</section> 

CSS

section.links figure, section.links figure { 
    background-color: #f3f3f3; 
    padding: 0.5em; 
    margin-bottom: 1em; 
} 

section.links figure { 
    margin-top: 1em; 
} 

section.links figcaption, section.links figcaption { 
    padding: 0 0.5em; 
} 

section.links a, section.links a { 
    font-size: 0.9em; 
    color: #000; 
} 

Answer 1

我想说

figure { 
    display: table; 
} 

figure a { 
    display: table-cell; 
} 

figcaption { 
    vertical-align: middle; 
} 

假设图像确定链路的大小。