无法点击DIV下的链接

Question

我有我的标志，其DIV跨越屏幕的100％。这意味着我不能点击我的链接，因为它与他们重叠我已经尝试z-index，但不知道我还能做什么？

这里是我的意思的例子：

HTML

<div id="header"> 
        <div class="login"> 
         <div class="login-text"> 
          <a class="login-a" href="/index.php?route=account/login">Login</a> 
          | 
          <a class="login-a" href="/index.php?route=account/account">View Account</a> 
          | 
          <a class="login-a" href="/index.php?route=account/logout">Logout</a> 
         </div> 
        </div> 

        <?php if ($logo) { ?> 
        <div id="logo"><a href="<?php echo $home; ?>"><img id="la-logo" src="<?php echo $logo; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>" /></a></div> 
        <?php } ?> 
       </div> 

CSS

#la-logo{ 
display: block; 
margin: 0 auto; 
max-width: 100%; 
    } 
.login{ 
    width: 290px; 
    height: 40px; 
    background-color: #FFFFFF; 
    text-align: right; 
    padding-right: 0px; 
    float: right; 
display: inline-block; 
} 
.login-text{ 
padding-right: 50px; 
padding-top: 10px; 
font-family:'quicksandlight'; 
} 
    .login a{ 
    color: #000000; 
padding-right: 0px; 
#header #logo { 
position: relative; 
top: 5px; 
margin: 0px auto; 
} 

Answer 1

您需要提供代码，默认情况下，除了浏览器以外，指定的仅有width: 100%;的div元素，默认样式不会导致它重叠链接。

只需将z-index属性添加到元素不会使其工作，元素也必须定位，您可以尝试position: relative;。

但是，在这种情况下你不应该有重叠的元素，你的代码会帮助我们做得更好。

Answer 2

的z-index不与静态positionning元素工作 Add

position: relative; 

到你的链接，你应该没问题。

Answer 3

您可以使用指针事件：无为您的div点击。

喜欢的东西this：

HTML

<button class="bad">click me</button> 
<div class="bad"></div> 

<button class="good">click me</button> 
<div class="good"></div> 

CSS

div.bad { 
    background: rgba(0, 0, 0, .25); 
    height: 100px; 
    position: absolute; 
    width: 100px; 
} 

button.bad { 
    position: absolute; 
} 

div.good { 
    background: rgba(0, 0, 0, .25); 
    height: 100px; 
    left: 200px; 
    pointer-events: none; 
    position: absolute; 
    width: 100px; 
} 

button.good { 
    left: 200px; 
    position: absolute; 
} 

和有点JQuery的

$('button').on('click', function() { 
    alert('clicked'); 
});