scrollbar-hide类无效是因为滚动上下文未建立，它只隐藏已存在的滚动条，不触发滚动；需确保元素有overflow类、固定高度、父容器未设overflow-hidden，且配置和路径正确。
直接加 scrollbar-hide 类没反应，大概率不是插件装错了，而是滚动上下文根本没成立——类本身不创造滚动能力，只隐藏已存在的滚动条。
scrollbar-hide 类为什么加了却看不到效果
这个类只对「已经是滚动容器」的元素起作用，它不负责触发滚动，只负责藏滚动条。常见失效场景：
- 目标元素没设
overflow-y-auto或overflow-x-scroll等触发滚动的工具类 - 父容器用了
overflow-hidden，把子元素的滚动上下文掐断了 - Flex/Grid 子项没显式设
overflow-y-auto，默认不创建滚动上下文 - 内容高度不够，没溢出，自然没滚动条可隐藏
-
tailwind.config.js里漏了plugins: [require("tailwind-scrollbar-hide")] -
content路径没覆盖到 JSX/TSX 文件（比如只写了js,ts却没加jsx,tsx）
Firefox 里滚动条还在？检查 scrollbar-width 是否生效
Firefox 只认 scrollbar-width: none，但它只在该元素自身是滚动容器时才生效。如果父级 overflow: hidden 或子项没设 overflow-y: auto，Firefox 根本不渲染滚动条——那也就谈不上“隐藏”。
- 用 DevTools 选中目标元素 → Styles 面板搜索
scrollbar-width，看是否被应用且未被覆盖 - 临时删掉父级
overflow: hidden，观察滚动条是否“闪现”再消失 - 确保该元素有固定高度（如
h-64）或max-h-类，否则内容不溢出，滚动上下文不成立
scrollbar-hide 和 tailwind-scrollbar 的 scrollbar-none 能混用吗
能，但没必要，而且容易出问题。
立即学习“前端免费学习笔记（深入）”；
- 两者都写
display: none+scrollbar-width: none，规则重复冗余 - 若两个插件都启用，JIT 编译器可能因优先级问题漏掉某条规则（尤其
-ms-overflow-style在旧 Edge 中容易被忽略） -
scrollbar-hide更轻量，适合只要隐藏；tailwind-scrollbar适合后续要定制颜色、圆角等 - 推荐二选一，别同时开
React/Vue 动态渲染后滚动条又出来了
不是类失效，是滚动上下文断了。数据加载前容器高度为 0，没溢出；加载后内容撑高，但 scrollbar-hide 类早已挂载，而浏览器没重算滚动上下文。
- 别把
scrollbar-hide加在数据 wrapper 上（比如<div className="list-wrapper">） - 必须加在滚动容器本身上——即那个设置了
overflow-y-auto且有固定高度的元素 - 如果容器高度靠 JS 动态计算，记得在内容更新后强制触发重排（例如
el.style.transform = 'scale(1)'）
最易被忽略的一点：隐藏滚动条 ≠ 移除滚动能力。所有方案都依赖 overflow 工具类存在，删掉它，scrollbar-hide 就只剩一个空壳。
