css 超出盒子滾動，不顯示滾動條

 

簡要代碼： 三個容器包圍起來，不需要計算滾動條的寬度。  盒子一：list，盒子二：list_mian，盒子三：a_badge_box

                <div class="list"> 
                    <div class="detailed">{{ date }}工作明細</div>
                    <!-- 明細內容 -->
                    <div class="list_main">
                        <div class="a_badge_box" v-for="(item, index) in arrList" :key="index">
                            <div class="a_badge">
                                <a-badge status="processing" />
                            </div>
                            <div class="a_badge_main">
                                <div style="color: #000000">日常設備巡檢備份</div>
                                <div>
                                    <span style="margin-right: 5px">11-09</span>
                                    <span style="margin-right: 20px">11-09</span>
                                    <span style="margin-right: 5px">11-09</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

給盒子一與盒子二設置樣式就可以

.list {
  width: 95%;
  height: 600px;
  position: relative;
  overflow: hidden;
}
.list_main {
    position: absolute;
    left: 15;
    overflow-x: hidden;
    overflow-y: scroll;
}
.list_main::-webkit-scrollbar {
  display: none;
}