我可以自定义滚动条的水平位置吗？

Question

我正在使用表格组件。 内容的高度大于表格的高度。 所以我需要一个滚动条。

但是表组件来自开源框架ant-design。 所以我不能直接修改代码。

在下图中，我想将滚动条移到表格中，即将滚动条向左移一点。

::-webkit-scrollbar {
    position: relative;
    left:-10px;
}

我用过财产position 。 但这没有用。 既不搜索谷歌。

这是codepen的代码示例： https ://codepen.io/anon/pen/eXqqqb那么，向左移动滚动条的解决方案是什么？

Answer 1

 /* width */ ::-webkit-scrollbar { width: 10px; } /* Track */ ::-webkit-scrollbar-track { box-shadow: inset 0 0 5px grey; border-radius: 10px; } /* Handle */ ::-webkit-scrollbar-thumb { background: grey; border-radius: 10px; } .list_container { overflow:auto; height: 50px; width: 40px; } 

 <div class="list_container"> <div class="item_direction">1</div> <div class="item_direction">2</div> <div class="item_direction">3</div> <div class="item_direction">4</div> <div class="item_direction">5</div> <div class="item_direction">6</div> <div class="item_direction">7</div> <div class="item_direction">8</div> <div class="item_direction">9</div> <div class="item_direction">10</div> <div class="item_direction">11</div> <div class="item_direction">12</div> </div> 

所以我编辑了答案。 这适用于div。