在overlay div中无法链接的链接

Question

我已经创建了四个div（绝对定位），以便我能够围绕同一个中心旋转它们。问题是，我在每个div中都有一个链接，因此不再工作（不可能点击）。 我设法让他们在Firefox中使用“pointer-events：none;”在div和“指针事件：汽车;”在链接上。不幸的是，这仅适用于Firefox。 所以我想知道是否有人有另一个解决方案（可能没有JavaScript）来实现Safari和Chrome中的链接（可能还有IE）。

HTML：

<div id="one"><a href="#">Link one</a></div>
<div id="two"><a href="#">Link two</a></div>
<div id="three"><a href="#">Link three</a></div>
<div id="four"><a href="#">Link four</a></div>

CSS：

#one, #two, #three, #four {
    height: 100px;
    width: 100px;
    position: absolute;
}

#one {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

#two {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

#three {
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}

这是jsFiddle：http://jsfiddle.net/jf6A5/。

提前感谢您的帮助。