多列布局问题
来源：10-1 CSS3 多列布局——Columns
安静的学者
2017-08-19 09:35
.columns {
width: 500px;
padding: 5px;
border: 1px solid green;
margin: 20px auto;
-webkit-columns:50px 3;
-moz-columns:50px 3;
-o-columns:50px 3;
-ms-columns:50px 3;
columns:50px 3;
}
为什么我把列的宽度变为50px没有变化呢，是哪里的原因呢？
写回答
关注
1回答
-
- 心陌灬琉璃梦
- 2017-08-19 12:56:37
① div宽度500=列宽x+列间距y，(div宽度500-列间距y) ÷ 列数3 ≈ 每列最大宽度z。在宽度500不变的情况下，自定义列宽只要≤每列最大宽度z，就能保持三列的布局；【经本人测试，最大列宽是155px】
② 宽度500不变的情况下，只要自定义列宽≤每列最大宽度z，即只要自定义列宽≤155px，无论你的列宽设置是什么数值，列宽不会发生任何变化；
③ 只有当div宽度或文本内容长度发生变化时，布局才会发生变化。
十天精通CSS3
本课程为CSS3入门教程，深刻详解CSS3知识让网页穿上绚丽装备
242553 学习 · 2623 问题
相似问题