下拉菜单的焦点和标签索引

Question

有点奇怪的一点，我一直在制作一个css和html只有下拉菜单点击焦点和标签索引并遇到问题。

单击菜单关闭时，我的下拉菜单中的链接不起作用。

在我向您展示小提琴之前有没有人遇到这个问题所以你知道我的意思在示例中谷歌的链接不起作用，因为菜单在点击链接时关闭。

HTML：

/* Css */

 li.collapse > a{
   cursor: pointer; 
   display: block;
 }
li.collapse:focus{ 
  outline: none;
}
li.collapse > div.inside{ 
  display: none;
}
li.collapse:focus div.inside{
  display: block; 
}
div.inside:focus{ 
  display: none;
}
div.inside:hover{
  display:block;
}
div.inside{}

 <li class=collapse tabindex="1">Click here for drop down links
    <div class="inside">
      <a href=http://www.google.co.uk>google</a> <br>
    </div>
</li>



   

https://jsfiddle.net/znq7mz1d/

有什么方法吗？

提前致谢！