Html 这个额外的是什么；“空间”；在Bootstrap<；span>；形象？

我正在尝试添加一个“X”图标，以便能够在Backbone.js中单击并删除某些内容。我正在使用Bootstrap的

图标。理想情况下，在添加CSS:hover之后，我可以将鼠标悬停在“X”上并显示指针。然而，在实际的“X”图标周围似乎有额外的空间，因此我可以在“X”周围的一个小区域内移动鼠标，但指针仍然显示出来，所以我猜所有这些都是元素的一部分

这是一张我的意思的图片（它是“X”周围的绿色区域）：

---

为什么会有“多余”的空间，我怎么才能摆脱它呢？谢谢

绿色区域是元素的填充，它是元素的一部分

如果要删除绿色区域，请添加

填充：0到您的元素样式。否则，从可点击区域中排除绿色区域，添加
框大小：内容框。您需要查看下面帖子中的链接以了解更多详细信息。
请通过JSFIDLE或类似工具提供代码示例，仅凭一个屏幕截图很难排除故障。如果不深入了解，它看起来像是由于背景图像（X）周围显示的背景色（绿色）因为图像小于元素的大小。我很奇怪为什么图标周围会有默认的填充。谢谢。对于一个没有内容的跨度来说，填充似乎是一个奇怪的选择（当然还是很有可能的），但是内容可能是通过css添加的：之前还是以某种方式？你能补充一些细节吗？绿色或多或少是开发者工具中填充的“标准”颜色。边距是黄色橙色，内容是淡蓝色。