我在协调这些元素方面遇到了很大的困难..
以下是我需要做的视觉解释。棘手的部分是因为我希望一个元素为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支持。