不可点击的锚标签 [英] Unclickable anchor tag

问题描述

我使用这个html代码

 < div class =titleIn> 
< h2>< a href =/ link2> link2< / a>< / h2> 
< / div> 
  

由于某些原因， link2 不是可点击的（无手形光标）

CSS是：

 。 titleIn {
 direction：rtl; 
 margin-bottom：10px; 
 margin-right：0; 
 margin-top：-10px; 
职位：亲属; 
 text-align：right; 
 z-index：-1; 
} 
  

有什么想法？

为什么 ，但我知道是什么导致了它：Your z -index：-1 。如果你删除了这个问题，问题就会消失（至少，它适用于Chrome，Firefox和Opera;不是IE6或IE7）。以下是示例的实时副本，

通过给它一个小于零的 z-index ，你将它放在主流内容的下面，我猜文档不会让事件通过它（就像任何带有非透明背景设置的元素一样）。

IE似乎与的组合有一个单独的问题：rtl; 和 position：relative; ，但我认为是是一个单独的问题。如果我删除 .titleIn 中除之外的所有样式：direction：rtl;位置：相对; ，IE仍然中断（链接不可点击）。如果我删除其中任何一个，IE开始工作（但当然，你的布局不会做你想做的）。

I use this html code

<div class="titleIn"> 
    <h2><a href="/link2">link2</a></h2>
</div>

and for some reason the link2 is not clickable (no hand cursor)

The CSS is:

.titleIn {
    direction: rtl;
    margin-bottom: 10px;
    margin-right: 0;
    margin-top: -10px;
    position: relative;
    text-align: right;
    z-index: -1;
}

Any idea?

解决方案

I can't say I know why, but I know what's causing it: Your z-index: -1. If you remove that, the problem goes away (at least, it does for me on Chrome, Firefox, and Opera; not on IE6 or IE7, though). Here's a live copy of your example, and an updated copy with z-index: 0 instead.

By giving it a z-index less than zero, you're putting it below the main flow content, and I guess the document isn't letting the event pass through it (just like any element with a non-transparent background setting).

IE seems to have a separate issue with the combination of direction: rtl; and position: relative;, but I think it is a separate issue. If I remove every style in .titleIn except direction: rtl; position: relative;, IE still breaks (the link is unclickable). If I remove either of those, IE starts working (but of course, your layout doesn't do what you want).

这篇关于不可点击的锚标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！