我有几个宽度未知(动态宽度)的 div。如何自动调整这些 div 的大小以适应浏览器宽度?
例如,我有 5 个宽度不同的 div。如果浏览器宽度只能填满 3 个 div,那么这 3 个 div 将自动调整大小以适应浏览器宽度,其余部分将显示在第二行。
如何使用 html5 和 css3 制作它。我知道 css3 中有一个新功能 flexbox,但我不确定我是否可以处理它。
我有几个宽度未知(动态宽度)的 div。如何自动调整这些 div 的大小以适应浏览器宽度?
例如,我有 5 个宽度不同的 div。如果浏览器宽度只能填满 3 个 div,那么这 3 个 div 将自动调整大小以适应浏览器宽度,其余部分将显示在第二行。
如何使用 html5 和 css3 制作它。我知道 css3 中有一个新功能 flexbox,但我不确定我是否可以处理它。
您可以根据您的要求使用 calss - 值。最小/最大宽度/高度
参见示例演示 jsFiddle
.grid {
display: box;
display: -webkit-flex;
display: flex;
}
.column {
padding: 20px;
}
.fluid {
box-flex: 1;
background: #ccc;
}
.fixed {
width: 100px;
background: red;
}