拍移动端版想在header头实现这么个效果

Question

最近在排移动端的版，想在header头部实现这么一个效果具体请看下方:

想要让头部的两边不动中间部分可以滚，如果直接有代码不甚感激

希望达到如图所示效果 两边不动中间可以平拖着滚这个排版可以实现吗？不希望推荐插件等

Answer 1

横向滚动的要素就是

.nav{
  white-space:nowrap;
  overflow:auto
}

下面是示例

https://codepen.io/xboxyan/pe...

Answer 2

感谢邀请：

授人鱼不如授人以渔， 思路建议:

    header整体看作左中右布局， 左右元素在边缘位置固定，中间元素自适应剩余宽度， 在中间元素内部，使用子元素横向不折行的布局，使子元素总宽超过外层定宽，外层容器可使用 overflow属性控制是否可滑动，应该可以满足您的需求