如何移除AG-Grid表头中的筛选选择框及右侧内边距？

1. 移除表头hover时的菜单按钮 #

你提到的右侧筛选选择框实际是AG-Grid的表头菜单按钮，可以直接在colDef（或defaultColDef）中添加配置禁用它：

defaultColDef: {
  flex: 1,
  minWidth: 50,
  sortable: true,
  resizable: true,
  suppressMenu: true // 禁用表头菜单，hover时不再显示右侧按钮
}

如果只想针对特定列禁用，单独在对应列的colDef里加suppressMenu: true即可。

2. 移除列右侧内边距 #

要让列尽可能窄，需要覆盖AG-Grid默认的表头单元格内边距，添加以下CSS样式：

/* 移除表头单元格右侧内边距 */
.ag-header-cell {
  padding-right: 0 !important;
}

/* 可选：进一步调整表头标签的内边距，确保3字符表头完全显示 */
.ag-header-cell-label {
  padding-right: 0 !important;
}

补充说明 #

如果需要保留表头右键菜单但仅隐藏hover时的按钮，可改用menuButtonShow: 'never'配置：

defaultColDef: {
  // ...其他配置
  menuButtonShow: 'never'
}

内容的提问来源于stack exchange，提问作者sheep14