如何包装盒子?

时间:2013-10-15 19:17:01

标签: html css flexbox

A有<section><article> s。当用户调整浏览器大小时,我想移动所有<article>元素并调整宽度100%。我试着用flex-box来做。这就是我想要实现的目标

img

JSFiddle here

section, article {
display: box;
}

article {
    background: red;
    margin: 10px;
    display:-moz-box; /* Firefox */
    display:-webkit-box; /* Safari and Chrome */
    display:-ms-flexbox; /* Internet Explorer 10 */
    display:box;
    max-width: 300px;
    min-width: 50px;
    padding: 20px;
    width: 100%;
    overflow: hidden;
}

section {
    display: -moz-box-flex;
    background: blue;    
}

1 个答案:

答案 0 :(得分:0)

删除您在其上设置的max-width

Updated jsFiddle - 我删除了左/右margins