包装盒在部分

A有一个<section>和<article> s。我想移动所有<article>元素，并在用户调整浏览器大小时将其宽度调整为100％。我试着用flex-box来做。以下是我想要实现 img http://up.programosy.pl/foto/boxes.jpg 包装盒在部分

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;  
}

来源

2013-10-15 Karol Białkowski

你有很多事情在这里出错。 'display：box'来自旧2009年的Flexbox草案，该草案正在出台（请参阅：http://stackoverflow.com/questions/15662578/flexible-box-model-display-flex-box-flexbox）。在任何浏览器中，2009年没有任何Flexbox实现支持包装，Firefox目前也不支持使用其现代化实现进行包装（请参阅：http://stackoverflow.com/questions/16773928/flexbox-and-wrap-property）。 Box-flex不是显示属性。你的第二个图只能用*列*方向来实现，这需要使用固定的高度。 – cimmanon

取出max-width你对他们的设置。

Updated jsFiddle - 我删除了左/右margins。

来源

2013-10-15 19:21:09

包装盒在部分

回答

相关问题