垂直对齐单行区块内的图片和文本
DOM结构
<div class="prj-item"><a href="#"><img src="img/icon_4.png" height="40" alt=""> <span>竞足单关</span><p class="small">曼联vs皇家马德里队</p> </a></div>
prj-item 作为图片和文本容器
CSS
.prj-item { padding-left: 50px; }
.prj-item img{ position: absolute; left: 15px; height: 40px; }
.prj-item p.small{ color: #8b8b8b; padding-left: 12px; margin-bottom: 0; }
主要是给容器prj-item里面的唯一一个图片img以绝对定位。然后给prj-item padding-left足以容下img，这样span标签的开始位置就不会是容器prj-item的0位置。
有多美？大概就像这样 
