Google chrome Can'；t foucs<；a>；在chrome中使用tab

我遇到了一个非常奇怪的问题，有三个链接：

<div>
    <a id="conservativeOption" href="#option1"><div id="conservativeTitleNew" class="investButtonTitle">Option 1</div><span id="more-conservative" class="portfolio-risk-level "></span></a>
    <a id="moderateOption" href="#option2"><div id="moderateTitle" class="investButtonTitle">Option 2</div><span id="moderate" class="portfolio-risk-level"></span></a>
    <a id="aggresiveOption" href="#option3"><div id="aggresiveTitle" class="investButtonTitle">Option 3</div><span id="more-aggressive" class="portfolio-risk-level"></span></a>
</div>

它只发生在Chrome中，IE9工作正常。

---

谢谢

在.investButtonTile div中使用tabindex属性

<div id="conservativeTitleNew" class="investButtonTitle" tabindex="1">Option 1</div>

选项1

像这样

如果删除这个css“position:absolute”，它就可以正常工作。但我不清楚原因：(

<div id="conservativeTitleNew" class="investButtonTitle" tabindex="1">Option 1</div>