https://www.runoob.com/w3cnote/flex-grammar.html
display: flex; justify-content: center; align-items: stretch; flex-wrap: wrap;
两列Div居中 显示 用传统float方式就不是很好实现，本着能用css的 就不用js的原则。就用Flex布局
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
.box {
display: flex;/*flex布局*/
justify-content: center;/* justify-content属性定义了项目在主轴上的对齐方式。 横向对齐方式 */
align-items: stretch; /* align-items属性定义项目在交叉轴上如何对齐 stretch（默认值）：如果项目未设置高度或设为auto，将占满整个容器的高度。 */
flex-wrap: wrap; /* flex-wrap ：定义子元素超过一行，如何换行 wrap：换行，第二行在第一行下面，从左到右 */
}
.boxInner{
650px;
height:30px;
background-color:#cccccc;
margin:10px;
}
</style>
</head>
<body>
<div class="box">
<div class="boxInner">1</div>
<div class="boxInner">2</div>
<div class="boxInner">3</div>
<div class="boxInner">4</div>
</div>
</body>
</html>
如果后期在这个页面右侧加入一个DIV放右边的话，可以弄成float 左右俩，然后左侧的话宽度写成
float: left; calc(100% - 260px);