css - 将文本与图像对齐 (CSS)

Question

现在如何:http://jsfiddle.net/cSazm/

我希望它是这样的:http://jsfiddle.net/mhprg/

第二个变体的问题是我不知道图像的确切大小，所以固定的 CSS 边距不起作用:(还有一个额外丑陋的 div..

还有其他解决办法吗？

Answer 1

您可以 float 图像，然后将 div 设置为表格单元格，它会自动拉伸(stretch)到可用宽度的 100%。

HTML:

<img src="http://lorempixel.com/g/80/80/" alt="" /><div>Text</div>

CSS:

div{
    display:table-cell;
}    

img{
    float:left;
}    

↪ View this example at JSFiddle