CSS：可能将Webkit滚动条“推”成内容？

通常滚动条的位置如下所示：

________________________________________
|                          |           |
|         content          | scrollbar |
|                          |           |
|                          |           |
|                          |           |
|                          |           |
|__________________________|___________|

我基本上希望在“自定义”滚动条和可滚动容器的外边界之间有一个空白：

________________________________________
|                    |           |     |
|      content       | scrollbar | gap |
|                    |     <     |     | 
|                    |           |     |
|                    |           |     |
|                    |           |     |
|____________________|___________|_____|

在:: – webkit-scrollbar或:: – webkit-scrollbar-track-piece上使用边距右键失败,Webkit的风格滚动条的通知状态如下：

Margins are supported along the axis of the scrollbar. They can be
negative (so that the track can for example be inflated to cover the
buttons partially).

我现在想知道是否有任何人通过其他方式将滚动条“推入”内容(或出于包装器).

我假设这可能只有(如果甚至)使用某种技巧 – 任何想法？

其他我尝试失败的东西是padding-right：10px和border-right：10px solid rgba(255,255,0)(透明边框).

解决方法

我认为,通过为右对齐的滚动条分配右边距是不可能的.滚动条是窗口UI的一部分,可能不会通过CSS样式.

然而,您可以在HTML的所有其他元素周围创建一个内容包装,给它一个最大宽度,小于100％并设置overflow：scroll;为包装.这将在几乎所有浏览器中实现预期的效果和工作.

[个人意见]我认为某些网页设计师是一个非常糟糕的习惯,谁想要控制我的屏幕上的每一块.例如,滚动条应该由窗口管理器而不是我正在查看的网站进行样式化.