隐藏水平滚动条，同时保持活动状态和垂直滚动状态

Question

我需要隐藏水平滚动条而不设置attr overflow-x:hidden，并且我不想隐藏垂直滚动条，因此::-webkit-scrollbar {display: none};是不可行的。我尝试设置"height:0px"，但它也会影响垂直滚动条。有什么办法将水平滚动条的显示设置为无？

Answer 1

.wrap {
  width: 100%;
  height: 100%;
  overflow-x: scroll;
}

.inner {
  width: 200%;
}

.wrap::-webkit-scrollbar {
  display: none;
}

<div class="wrap">
  <div class="inner">
  </div>
</div>

JS Fiddle示例：https://jsfiddle.net/toszgwb6/