Html 如何将多个tap目标合并为一个以固定PageSpeed“；点击太近的目标“-警告 情况和问题说明

我目前正在根据来自的提示对一个网页进行移动优化，我收到了很多关于tap目标彼此太近的警告。问题是：PageSpeed看到多个点击目标，而实际上只有一个目标

例子

• 页面速度输出（简化）：

  抽头目标接近1个其他抽头目标。
  tap目标接近1个其他tap目标。
  

• 相应的CSS/HTML（简化）：

  .glyphicon:：before{
  内容：“x”；/*替换自定义字体的相同大小购物车符号*/
  }
  .徽章{
  背景色：#999；
  边界半径：10px；
  颜色：#fff；
  显示：内联块；
  字体大小：12px；
  字号：700；
  线高：1；
  最小宽度：10px；
  填充：3px7px；
  文本对齐：居中；
  垂直对齐：基线；
  }
  a{
  文字装饰：无；
  边框颜色：#000；
  边界半径：3px；
  边框样式：实心；
  边框宽度：1px；
  保证金：1px2px；
  填充：5px 8px；
  }

  ---

  您将锚元素包装在两个内联元素周围。如果将其环绕在块级元素（如div）周围，则将有一个块级链接，而不是多个内联链接。您还可以根据高度和宽度来调整点击目标的大小，从而优化谷歌的点击目标。
  魔鬼在细节中，我们似乎没有任何提示说明为什么PageSpeed会解释
  中的单个
  元素，为什么这需要两个子元素开始？一个简单的

  元素只包含文本就足够了。图标可以通过
  ：before
  应用于链接本身，不间断的空格可以用填充或边距代替。这只是一个例子，还有一个移动菜单按钮，由三个水平条相互堆叠而成，这就产生了同样的问题。我宁愿一般地解决这个问题，而不是单独处理每一个元素（如果可能的话）。我很惊讶，PigSePED甚至认为这些子元素是单独的标签目标…可能与你在“简化”CSS中所遗漏的附加格式化、脚本附带的事件处理程序有关。等
  <a href=#>
    <span class=glyph>..</span>&nbsp;<span>..</span>
  </a>