Exemplo de Flexbox ORDER
Um exemplo de como funciona o Flexbox do CSS3.
HTML
<div class="main">
<div class="primeiroDiv">Primeiro div Primeiro div Primeiro div Primeiro div </div>
<div class="segundoDiv">Segundo div</div>
<div class="terceiroDiv">Terceiro div</div>
</div>
CSS
.main {
width:500px;
background:gray;
height:500px;
display: -webkit-flex;
display: flex;
}
.main div {
background:#CCC;
margin:10px;
-webkit-flex:1 1 auto;
flex:1 1 auto;
/*
A propriedade FLEX Ă© uma atalho para a mesma coisa escrita abaixo
-webkit-flex-basis:auto;
-webkit-flex-shrink:1;
-webkit-flex-grow:1;
*/
}
.main div.primeiroDiv {-webkit-order:2;}
.main div.segundoDiv {-webkit-order:3;}
.main div.terceiroDiv {-webkit-order:1;}