CSS的多栏布局

左栏宽度自适应，右栏宽度固定

• 左栏设置左浮动，宽度100%，左外边距为负右宽度
• 右栏设置右浮动及宽度

两栏弹性页面

左右各自浮动，百分比计算宽度

左右固定宽度，中间自适应

• 左栏左浮动，右栏右浮动，中间元素放最后。
• 中间元素被左浮动的100%包裹，左右均左浮动，设置负margin值。
• 外边的盒子设置flex，中间设置flex: 1

{
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
}

https://www.cnblogs.com/guoqing26/p/5313481.html
https://blog.csdn.net/a_small_insect/article/details/79410163

阮一峰 Flex 布局教程：语法篇

http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html