html - 如何 overflow hidden : scroll scrollbar in centered div

Question

我知道这个问题有很多重复的问题，但到目前为止这些都没有用。
我有一个宽度未知的 div，它使用 overflow-y: scroll，但我想隐藏滚动条并使其仍然可滚动。它位于屏幕中间，我该怎么做？

.content-middle {
  margin: 0 auto;
  text-align: center;
  max-height: 81vh;
  overflow-y: scroll;
}

<div class="content-middle">
  <p>My content is here</p>
</div>

Answer 1

基本上您要做的是将可滚动元素放在另一个元素中并将其绝对定位在右侧。 (负值)

然后只关注可滚动元素的内容。

body {
  overflow: hidden;
}

.content-middle {
  margin: 0 auto;
  text-align: center;
  max-height: 81vh;
  overflow-y: scroll;
  position: absolute;
  width: 100%;
  right: -17px;
}

<div class="content-middle">
  <p>My content is here</p>
</div>