fixed左右滑动问题

Question

如上图：
我现在要做的是固定在顶部，同时要可以左右滑动；
问题是固定和左右滑动不能同时使用，设置了固定，就不能左右滑动了；相反也是

这个问题要怎么解决呢

Answer 1

类似这样，套一层header__container，这个容器设置position: fixed; overflow-x: auto; width: 100%;，然后header给一个宽度就可以了。<div class="header__container">&nbsp; &nbsp; <div class="header">&nbsp; &nbsp; &nbsp; &nbsp; <ul class="navs">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">推荐</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">护肤</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">卸妆</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">面霜</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">护发</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">唇妆</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="nav">底妆</li>&nbsp; &nbsp; &nbsp; &nbsp; </ul>&nbsp; &nbsp; </div></div>.header__container {&nbsp; &nbsp; position: fixed;&nbsp; &nbsp; width: 100%;&nbsp; &nbsp; overflow-x: auto;}.header {&nbsp; &nbsp; width: 900px;}