开个文章记录一下开发过程中遇到的关于css生僻杂症。（随时更新中...）
1.flex布局下自动适应宽度导致设置子元素宽度失效
如图，flex布局下会自动适应宽度导致设置的宽度失效，这时给子元素加上flex-shrink: 0;可以解决。flex-shrink的默认值为1，如果没有显示定义该属性，将会自动按照默认值1在所有因子相加之后计算比率来进行空间收缩。
2.padding导致div宽高改变。给某个固定宽高的块级元素加padding会导致宽高变大，这时加上box-sizing: border-box;限制就不会改变该块的宽高。
3.浏览器默认填充了账号密码之后，输入框会改变背景颜色，在某些情况下会变得很丑，给输入框加如下样式解决：
box-shadow: 0 0 0px 1000px #fff inset !important;
4.父子元素如果上边框重合给子元素加margin-top会带着父元素一块，将上边框分开即可比如在父元素顶上加个padding-top或者border或者其他的别让他俩重合就行
5.img标签，这个东西可以设置宽高，我一直以为这是个块级元素，直到我设置margin:auto失效之后，我查了查原来这是个行内元素，又是一个可替换元素，类似于Inline-block，所以要想使img标签的margin:auto可行需要加display:block.
6.滚动条隐藏，各个浏览器不同。
//Chrome Safari 隐藏滚动条
.className::-webkit-scrollbar {
display: none;
}
.className{
scrollbar-width: none; // firefox 隐藏滚动条
-ms-overflow-style: none; // IE 10+ 隐藏滚动条
}
