1、网格设计
方法一、float（浮动）
float 将4个div 从左至右排序，当外围区块小时，4个div会根据外围的区块宽度重新调整内容显示的位置。
原理就是利用float:left将元素浮动靠左排列，反之用靠右排列，当超过容器最大宽度时，div就会自动挤到下一行。
方法二、display:inline-block
使用display:inline-block也可以实现，实现从左向右排列，只要把原本的float:left换成display:inline-block就获得一样的效果，同时也可以通过指定text-align来达到文字靠左向靠右对齐。
原文：http://www.cnblogs.com/cxzz/p/7967784.html