固定宽度的流体宽度部分，带有文本溢出省略号

Question

我在协调这些元素方面遇到了很大的困难..

以下是我需要做的视觉解释。棘手的部分是因为我希望一个元素为72px，另一个元素为10px，另一个元素为“其余元素”。

这是我的第一次尝试： http://jsfiddle.net/cutcopypaste/7gXRg/

HTML：

<ul id="albums" class="rows">
    <li>
      <a>
        <img class="thumb" src="http://placehold.it/350x150"/>
        <span>
          <em>An item with a great deal of text that continues on and on but should not wrap to a new line</em>
          <strong>Short content</strong>
         </span>
       </a>
    </li>
    <li>
      <a>
        <img class="thumb" src="http://placehold.it/350x150"/>
        <span>
          <em>Some ofr words,</em>
          <strong>An item with a great deal of text that continues on and on but should not wrap to a new line</strong>
         </span>
       </a>
    </li>
    <li>
      <a>
        <img class="thumb" src="http://placehold.it/350x150"/>
        <span>
          <em>This and That and that and this and what and for and never you miss</em>
          <strong>Johnnyycakes</strong>
         </span>
       </a>
    </li>
</ul>

这是尝试使用表格，但它似乎真的不起作用！ http://jsfiddle.net/cutcopypaste/PwBms/

只需要webkit支持。