以 100% 宽度在 CSS 中排序答案

【问题标题】：ordering in css with 100% width以 100% 宽度在 CSS 中排序
【发布时间】：2015-07-07 21:00:34
【问题描述】：

我想要 100% 宽度的子 div。

有没有可能？

html

<div class="main">
    <div class="order2">order2</div>
    <div class="order1">order1</div>
</div>

css

.main{
    display: flex;
}

.order1{
 order:1;
 width:100%;
}
.order2{
 order:2;
width:100%;
}

【问题讨论】：

标签： css

【解决方案1】：

您可以调整“flex”显示的方向

.main{
    display: flex;
    flex-direction: column;
}

【讨论】：

【解决方案2】：

添加 flex-direction: 列；

.main{
display: flex;
flex-direction: column;
}

【讨论】：

【解决方案3】：

为父 div 使用 display:flex 有什么理由吗？如果你删除它，你会得到一个全宽的孩子。另外，如果你正在寻找一个列表，去

<ul> <li> </li></ul>

结构。

【讨论】：