删除Firefox工具栏按钮和下拉标记之间的间隙答案

【问题标题】：Removing the gap between a firefox toolbarbutton and the dropdown marker删除Firefox工具栏按钮和下拉标记之间的间隙
【发布时间】：2013-04-04 16:36:43
【问题描述】：

我有一个 menu-button 类型的 toolbarbutton，它在我的 Firefox 扩展程序中运行良好，但它的风格不像我想要的那样安静。

按钮图像和下拉标记箭头之间存在轮廓间隙（红色箭头显示了我所指的轮廓间隙 - 轮廓是问题的一部分 - 您还可以看到 AdBlock Plus 按钮没有这个问题）。

此外，当您将鼠标悬停在图像/按钮上时，会出现一个带阴影的灰色背景。

我想消除差距（AdBlock Plus 用他们的工具栏按钮管理这个，但我还没有弄清楚如何）并删除阴影（我有为按钮定义的悬停图像应该足以表明你在点击区）。

任何人都可以给我任何指示吗？这似乎与以下两个类有关：toolbarbutton-1 和 chromeclass-toolbar-additional

谢谢，

调频

【问题讨论】：

我现在发现，当我在工具栏自定义屏幕中选择“小图标”时，间隙消失了。也许这有一个线索，但即使通过 DOM 检查器比较 CSS 我也找不到导致差距的原因。

标签： css firefox button xul toolbar

【解决方案1】：

差距是因为类型是“菜单按钮”，而ADP按钮类型是“菜单”。间隙样式取决于您使用的主题。

图像问题，如何设置图像？在我的情况下，它可以很好地设置

button.style.listStyleImage =  'url("chrome://referrercontrol/skin/icon24.png");'

【讨论】：

啊哈！你是绝对正确的.. AB+ 按钮上没有“点击”操作，只有菜单 - 这是有道理的。
关于图像问题...我使用以下内容为所有图标分配相同的 png：#BabelSheepButton {list-style-image: url("chrome://babelsheepbutton/content/babelSheepButton.png");} 然后以下内容为正常和悬停模式拉出正确的区域@987654323 @当我悬停时显示悬停图像，还有我不想要的渐变背景。
可能是火狐默认的css导致的，或者你可以试试添加!important。