带有元素内部包装的CSS flexbox

我有一个排序元素的问题。我有容器（flexbox）vith一个孩子（订单= 1）和兄弟div（包装我不会使用flexbox）与孩子订购，但不工作。带有元素内部包装的CSS flexbox

可以看到完整的例子：http://codepen.io/isyara/pen/HtniA（检查包装IM-改变顺序）

感谢

2013-03-13 david

你的问题有点难理解，你的意思是你想要第二个'.contai ner'元素看起来与第一个相同？或者第一个应该和第二个一样？ – cimmanon 2013-03-14 02:03:08

我有一个孩子命令和两个小孩进入包装和柔性盒来订购带有不包装的孩子的包装，我不希望包装订单只是孩子进入。（请参阅带有和不带包装的codepen示例） – david 2013-03-14 08:49:21

如果你想要的是有第一个例子看起来像第二个例子，那么你就出来的运气。柔性物品只能放置在柔性容器内。

+---------------+ 
| +---------+ | 
| | a | | 
| + --------+ | 
| +---------+ | 
| | b | | 
| | +-----+ | | 
| | | c | | | 
| | +-----+ | | 
| | +-----+ | | 
| | | d | | | 
| | +-----+ | | 
| +---------+ | 
+---------------+

如果外部容器和b都是柔性容器（施加到它们display: flex），则只有这些布置是可能的：

（CD）一个
（DC）一个
一个（CD）
一个（DC）

如果b是而不是 flex容器，则c和d不是flex项目，并且根本不能使用order属性进行排列。

元素A，c和d必须sibblings完全重新排列：

+---------------+ 
| +---------+ | 
| | a | | 
| + --------+ | 
| +---------+ | 
| | c | | 
| + --------+ | 
| +---------+ | 
| | d | | 
| + --------+ | 
+---------------+

现在，你可以拥有所有的安排，从前面的例子，加上这些：

来源

2013-03-14 12:41:23 cimmanon

是的，我想要c安排，但a不是c - d的兄弟。谢谢你的解释cimmanon – david 2013-03-14 12:46:57

带有元素内部包装的CSS flexbox

回答

相关问题