幻灯片箭头的点击区域宽度超过图标

Question

在我的WordPress开发网站上，我有一个用于图库的幻灯片功能。当你点击一张图片时，它会开始播放幻灯片。我的问题是我的两个白色箭头，一个在左边，一个在右边。箭头的可点击区域比图标的大小要宽。请参见下面的图片。

可点击区域比图标宽

这是我的开发网站的URL

我尝试在这个问题中包含我的代码，但系统告诉我“您的问题似乎是垃圾邮件”。

CSS文件是“https://dev.francisbegin.ca/wp-content/plugins/gallery-lightbox-slider/css/photobox/photobox.css?ver=1.0.0.39”

播放的HTML位于最底部，在body关闭之前。包含div的ID是“pbOverlay”。

任何帮助将不胜感激。我是stackoverflow的新手，请告诉我如果我的问题不合适。

Answer 1

这很可能是由于图标所使用的字体的字距设置造成的。每个字符周围都有一些空间，以防止其与其他字符碰撞。在18em的情况下，这个空间比其他情况下更加明显。

如果您想消除这个空间，您可以考虑使用SVG或其他图像来替代当前的文本内容。然而，给用户一些额外的空间来点击也没有问题。