flex布局时Dom元素宽高均为auto时border引发的布局问题

flex布局时在宽高都为auto时不想因border边框导致布局发生抖动或者改变有以下几种解决方案：
1.outline:如果不设置圆角，可以用这种方式，因为outline设置圆角只适用于火狐浏览器，真的是坑！！！
outline不同于border，他不会占据位置空间，所以可以很好地解决由于border的1到2个像素引发的布局抖动。
使用方法:

 out-line:1px solid #f40;

2.此处问题指的是宽高都为auto，如果Dom元素宽高确定，在设置边框的元素上进行以下设置：

box-sizing：border-box；

3.flex布局宽高都为auto时有一种解决办法，那就是给元素设置box-shdow属性，但这个前提是该元素设置过圆角，办法如下：

border-radius:3px;
box-shadow:0 0 0 2px #f40;

意为：水平位置，垂直位置，阴影模糊位置都不加设置，然后给元素加一个2像素的f40颜色的一个阴影，该阴影不会拉伸，所以就成边框了。哭死。。。代码不规范，两行泪、、、、