Firefox下dropdown-menu被截断或错位的根本原因是其对position: absolute元素的容器溢出处理更严格,当父级设置overflow: hidden或auto且下拉菜单未脱离剪裁边界时即被裁剪。Firefox 下 dropdown-menu 被截断或错位根本原因是 Firefox 对 position: absolute 元素的容器溢出处理更严格,当父级(比如 .dropdown)设置了 overflow: hidden 或 overflow: auto,而下拉菜单又没脱离该容器的剪裁边界时,就会被砍掉。常见于把下拉菜单放在卡片(.card)、模态框(.modal-body)或带滚动的侧边栏里。Chrome 有时"宽容"地显示出来,Firefox 则按规范裁剪。检查父容器是否意外加了 overflow: hidden ------ 特别是自定义 CSS 或某些组件库封装后留下的副作用给触发元素(.dropdown-toggle)加 data-bs-popper="none" 并手动指定 boundary,但更推荐用 Bootstrap 自带的 popperConfig在初始化时显式设置 boundary: 'viewport',强制弹出层相对于视口定位:const dropdown = new bootstrap.Dropdown(element, { popperConfig: { strategy: 'fixed', modifiers: { name: 'preventOverflow', options: { boundary: 'viewport' } } }});data-bs-toggle="dropdown" 在 Firefox 中不响应点击不是 Bug,是事件冒泡被意外阻止了。Firefox 对 click 和 pointerdown 的触发时机更敏感,如果父级监听了 mousedown 并调用了 e.preventDefault() 或 e.stopPropagation()(比如某些自定义下拉封装、拖拽库、或富文本编辑器),就会导致 Bootstrap 的 click handler 没机会执行。 MacsMind 电商AI超级智能客服