当svg有位置时，Firefox的popover问题：绝对

Question

我有一个与Safari，Chrome和IE完美搭配的popover，但在Firefox中不起作用（它没有出现）。

我创建了一个jsfiddle来说明问题： https://jsfiddle.net/sregorcinimod/7x4vuwLr/8/

当您单击蓝色矩形时，应显示一个弹出窗口。

问题在于我在svg上有一个绝对的位置

#spacing svg{
  max-width:100%;
  position:absolute; //this is the line that is causing issues
  bottom:0px;
}

如果我删除该行，则会出现弹出框，但我需要将其用于其他内容。

约束是：

1. 我需要有一个位置：svg上的绝对位置，因为其他更复杂的东西不在jsfiddle中，即多层svgs的响应式定位。
2. 我需要触发器是焦点而不是单击，因为当用户点击标题中的x或浏览器窗口中的任意位置时，我需要关闭popover。

我尝试过的事情：

1. 将svg包装成div。
2. 更换容器。

Answer 1

向rect添加tabindex属性，例如的tabindex = “0”