Exemplo de Flexbox

Um exemplo de como funciona o Flexbox do CSS3.

HTML

<div class="main">
    <div class="primeiroDiv">Primeiro div </div>
    <div class="segundoDiv">Segundo div</div>
    <div class="terceiroDiv">Terceiro div</div>
</div>

CSS

.main {
    width: auto;
    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;
    */
}

.segundoDiv {
  flex: 3 1 auto !important;
}