<div class="container container1">
  <div class="flex-item flex-item1">1 1</div>
  <div class="flex-item flex-item2">1 2</div>
  <div class="flex-item flex-item3">1 3</div>
</div>

*{margin:0;padding:0;}
body{font:12px/1.5 'Microsoft Yahei','\5b8b\4f53',tahoma,arial,sans-serif; color:#f00; background:#F2F8FD}
fieldset,img{border:0}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal}
ol,ul,li{list-style:none}
input,select{font-family:Tahoma;font-size:12px; color:#b09d85;}
a{text-decoration:none; color:#b09d85}
a:hover{text-decoration:none;}

.container{width: 840px;height: 240px;background: #DBEFFA;margin: 10px}
.flex-item{background: #BDD8F5;margin: 10px;color: #000;text-align: center;font-size: 14px;}
.container1 .flex-item,.container2 .flex-item,.container3 .flex-item,.container4 .flex-item,.container5 .flex-item{width: 100px;height: 100px}

.container1 .flex-item1{order: 0;flex-grow: 1}
.container1 .flex-item2{order: -1;flex-grow: 2}
.container1 .flex-item3{order: -3;flex-grow: 1}

.container1{display:flex;flex-direction:row;}