我有一个我无法修改的html布局,因为它是一个3d派对库。
我有四个div,我希望它们在这样的Flexbox中:
1 ------ 2 ------ 3
(其中2位于中心,4位根本不可见)。
我创建了一个示例here。
似乎它主要起作用,因为我想除了最后一个div弄乱项目编号2的中心位置的事实。有没有办法我可以通过css完全“排除”它从flex数组中虽然是在HTML?
.fc-toolbar {
background-color: #7CC2DD;
color: white;
height: 5rem;
display: flex;
align-items: center;
justify-content: space-between;
}
.fc-left {
order: 0;
}
.fc-right {
order: 2;
}
.fc-center {
order: 1;
}
.fc-clear {
}
<div class="fc-toolbar">
<div class="fc-left">
<button type="button">
<
</button></div>
<div class="fc-right">
<button type="button">
>
</button>
</div>
<div class="fc-center">
<h2>May 2016</h2>
</div>
<div class="fc-clear"></div>
</div>
答案 0 :(得分:3)
你可以给元素<Persons>
<Person ID="1">
<Name></Name>
...
</Person>
<Person ID="2">
<Name></Name>
...
</Person>
...
</Persons>
,它将被取出流程,就像你对非flex元素一样。
您可以找到更新的jsfiddle here。