这里说的三个div同一行排列，实际上还有一个container，也是一个div，用于约束三个div
网上有很多帖子，大多是不管用的，我试了很多遍，终于成功，诀窍在于 container需要引入display:flex;
并且在中间的div中要引入flex:1;的属性，其他的都是次要的！直接上代码：
<html>
<head>
<meta charset=”utf-8″>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<style type=”text/css”>
#mainwrap{
width: 100%;
height: 100px;
display:flex;
}
.left{
width: 150px;
height: 100%;
background: yellow;
float: left;
}
.right{
width: 150px;
height: 100%;
background: pink;
float: right;
}
.center{
width: auto;
height: 200px;
background: green;
flex:1;
}
</style>
</head>
<body>
<div id=”mainwrap”>
<div class=”left”>12122341324</div>
<div class=”center”>中间是弹性长度</div>
<div class=”right”>2121313214</div>
</div>
</body>
</html>