如何设置div内的模块靠左显示，模块内容按行显示？

问题：

在面板上翻页显示16个图片和信息，如何设置div内的模块靠左显示，模块内容按行显示，设置了float没有效果。

答案：

要将div内的模块靠左显示，并按行排列模块内容，可以使用以下方式：

1. 给div容器添加flexbox属性：

   

   jQuery+CSS3 3D立体图片排列布局代码

   jQuery+CSS3 3D立体图片排列布局代码

   下载

   #list {
     display: flex;
     flex-wrap: wrap;
   }

   flex-wrap: wrap属性允许元素在达到容器边界时换行。

2. 设置模块为flex元素：

   #list > div {
     text-align: center;
   }

   text-align: center;用于将模块的内容居中显示。

3. 将span标签更改为div标签：

   <div>...</div>

   div标签允许您对模块内容进行更多样式控制。

完整代码：

<div id="List">
  <div>
    ...
  </div>
  ...
</div>