左右两列导航分开滑动（移动端中）

前提：

         html,body{height: 100%;}

          body{ display: flex; flex-direction: column;}（？？一直不明白为什么）

主体：

         section { overflow: auto; }

         .why {  display: flex; }

          .conl { overflow: auto; }

 

 

 

关系：

 <section>

        <div class="why">

            <div class="conl">

                <li><a href="#youxuanbangdan">优选榜单</a></li>

                <li><a href="#nvzhuang">女装</a></li>

                <li><a href="#nanzhuang">男装</a></li>

                <li><a href="#caizhuang">彩妆</a></li>

                <li><a href="#nvshihuli">女士护理</a></li>

                <li><a href="">视频</a></li>

                <li><a href="">食品</a></li>

                <li><a href="">女鞋</a></li>

            </div>

           <div class="conl">

                <li><a href="#youxuanbangdan">优选榜单</a></li>

                <li><a href="#nvzhuang">女装</a></li>

                <li><a href="#nanzhuang">男装</a></li>

                <li><a href="#caizhuang">彩妆</a></li>

                <li><a href="#nvshihuli">女士护理</a></li>

                <li><a href="">视频</a></li>

                <li><a href="">食品</a></li>

                <li><a href="">女鞋</a></li>

            </div>

       </div>

  </section>