手撸两端固定，中间随内容自动撑高的H5代码，达到一定高度中间内容出现滚动条

工作上遇到的，感觉比较实用，记录一下

没超过最大高度不会有滚动条

内容超过出现滚动条

	 /* css代码 */
	    .box{
        display: flex;
        flex-direction: column;
        width:400px;
        min-height:30vh; /* 保证最小高度 */
        max-height:50vh; /* 保证最大高度，超过该高度中间出现滚动条 */
        border:1px solid red;
    }

        
  .fix{
      display: flex;
      flex-grow: 0;
      border:1px solid blue
  }
  .scroll{
      display: flex;
      overflow: auto;
  }

    <div class='box' >
            <div class="fix">上面这个是固定的</div>
            <div class='scroll'>前几年，高铁运力不足的时候，某些路局为了缓解客流压力，冒着列车超员报警压死弹簧的安全隐患和列车服务设施过量损耗的风险选择发售无座票让人们能早点回家。但是没人理解铁路人的良苦用心，随之引发的就是社会舆论“强烈要求无座票半价”“黑心铁路有座无座一个票价”以及出现无座票旅客霸占有座票旅客座位的现象、无座票旅客霸占一等座、商务座的现象。铁总这下就怒了，干嘛要做这种吃力不讨好的事，加上运力在这几年越来越充足，一纸下文各个路局禁止发售高铁无座票。________各路局情况不一样，有些路局还是会发售少.前几年，高铁运力不足的时候，某些路局为了缓解客流压力，冒着列车超员报警压死弹簧的安全隐患和列车服务设施过量损耗的风险选择发售无座票让人们能早点回家。但是没人理解铁路人的良苦用心，随之引发的就是社会舆论“强烈要求无座票半价”“黑心铁路有座无座一个票价”以及出现无座票旅客霸占有座票旅客座位的现象、无座票旅客霸占一等座、商务座的现象。铁总这下就怒了，干嘛要做这种吃力不讨好的事，加上运力在这几年越来越充足，一纸下文各个路局禁止发售高铁无座票。________各路局情况不一样，有些路局还是会发售少</div>
            <div class='fix'>下面这个也是固定的</div>
    </div>