问题：flex布局本来应该是可以等份分配的，但现在因为第二个盒子文字比其他盒子少，宽度就变小了

一、flex的宽度计算方式是容器剩余空间+具有flex属性的元素自身尺寸：
例如在一个width:400px的容器中，有a、b、c 三个width:100px的元素，给a元素flex:2的属性，给b元素flex:1的属性，不给c元素。
计算宽度是：剩余空间（400px-300px）:100px + 参与flex项目尺寸200px=300px 再按3份的比例给a2份，b1份。
最后：a:width:200px ; b:width:100px ; c:width:100px

二、flex:grow的宽度计算方式只是容器剩余空间：
还是在一个width:400px的容器中，有a、b、c 三个width:100px的元素，给a元素flex-grow:2的属性，给b元素flex-grow:1的属性，不给c元素。
计算宽度是：剩余空间（400px-300px）:100px
剩余100px再按3份比例给a2份+自身本身尺寸，b1份+自身本身尺寸。
最后：a:width:166.7px ; b:width:133.3px ; c:width:100px

因为自身宽度小一些，所以自身+分配的剩余宽度自然就比其他的小

bootstrap布局
1.
.container容器无法居中的问题，不要在body里面设置宽度
/* width: 10rem; */
响应式和rem一起布局的冲突
——
2.
bootstrap布局
慎用定位、浮动等导致元素脱标的问题，不然会导致原先bootstrap的css样式失效

.container容器可以保存水平居中

.exhibition.container {
/* margin: 0 30px; */
}
直接去改bootstrap自带的类会导致全局混乱，实在要改可以使用交集选择器

row下的元素（比如.ex_body）不会被她的container框架里面的col撑大

单独设置col-xs-offset-3不起效

解决方法：

  <div class="col-xs-6 col-xs-offset-3 col-sm-offset-0">

超小屏col-xs-offset-3
并且不影响其他设备宽度col-sm-offset-0