我遇到了这个问题，解决起来非常简单。

取两个容器。内部将是可滚动的容器，外部显然将容纳内部：

#inner_container { width: 102%; overflow: auto; }
#outer_container { overflow: hidden }

它非常简单，适用于任何浏览器。

如果出于某种原因，您希望使用box模型：border box，则向内部div添加填充（如当前接受的答案）将不起作用。

在这两种情况下都有效的方法是将内部div的宽度增加到100%加上滚动条的宽度（假设溢出：隐藏在外部div上）。

例如，在CSS中：

.container2 {
    width: calc(100% + 19px);
}

在JavaScript中，跨浏览器：

var child = document.getElementById('container2');
var addWidth = child.offsetWidth - child.clientWidth + "px";
child.style.width = 'calc(100% + ' + addWidth + ')';

我只是想分享一个组合片段，用于隐藏开发时使用的滚动条。这是一组在互联网上找到的对我有用的片段：

.container {
    overflow-x: scroll; /* For horiz. scroll, otherwise overflow-y: scroll; */

    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
}


.container::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
}

要隐藏内容溢出的元素的滚动条，请使用。

.div{

  scrollbar-width: none; /* The most elegant way for Firefox */
}

只是一个测试，效果很好。

#parent{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#child{
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding-right: 17px; /* Increase/decrease this value for cross-browser compatibility */
    box-sizing: content-box; /* So the width will be 100% + 17px */
}

工作Fiddle

JavaScript：

由于不同浏览器的滚动条宽度不同，最好使用JavaScript处理。如果执行Element.offsetWidth-Element.clientWidth，将显示精确的滚动条宽度。

JavaScript工作Fiddle

Or

使用位置：绝对，

#parent{
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

#child{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: -17px; /* Increase/Decrease this value for cross-browser compatibility */
    overflow-y: scroll;
}

工作Fiddle

JavaScript工作Fiddle

信息：

基于这个答案，我创建了一个简单的滚动插件。

只需使用以下三行，您的问题就会得到解决：

#liaddshapes::-webkit-scrollbar {
    width: 0 !important;
}

其中liaddshapes是要滚动的div的名称。