CSS网格布局

Question

我想创建一个CSS布局像下面的图片：

http://i47.tinypic.com/34y4ewk.png

我已经成功地得到它的排序工作，但如图所示我不能让旁的文字图像这里http://jsfiddle.net/jVwf4/

如何让图像旁边的文字有什么建议？

谢谢

Answer 1

你需要翻转<p>和<img>标签的顺序，并给予<img>标签float: left; CSS属性。

http://jsfiddle.net/wG9uH/5/

Answer 2

，你可以让你这样的HMTL块：

<div> 
    <p class="title">Cape Town<img width="100" height="75" src="http://www.geonames.org/img/wikipedia/131000/thumb-130255-100.jpg"></p> 
</div> 

，然后漂浮在图像左右这样的：

.title img{ 
    float: left; 
    margin-right: 1em; 
}