CSS - 使用绝对位置时链接无法点击

huo*_*ong 21 html css position hyperlink clickable

这是我的标题的HTML脚本:

<div class="header">
<div class="logo"><a href="Default.aspx"><img src="style/images/logo.png" alt="" /></a></div>
<div class="toplink"><a href="Signin.aspx">Sign in</a></div>
<div class="search">
    <form class="searchform" runat="server" method="get">
        <input type="text" id="s" name="s" value="Search for photos" onFocus="this.value=''" onBlur="this.value='Search for photos'"/>
    </form>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是CSS脚本:

.logo {
    padding: 30px 0;
}

.logo img {
    display: inline;
} 

.toplink {
    position: absolute;
    bottom: 40px;
    right: 280px;
    font-size: 14px;
}

.search {
    position: absolute;
    bottom: 10px;
    right: 0;
    font-size: 14px;
    width: 330px;
}
Run Code Online (Sandbox Code Playgroud)

不知何故,登录链接不可点击,但当我删除绝对位置时,它正常工作.反正是否仍然保持位置使链接工作?任何建议表示赞赏,并提前感谢.

-Edit-结果问题出在其他地方.实际上我正在使用母版页,我使用它创建了一个默认的ASP页面.问题只发生在我测试ASP页面时,而不是我用来创建母版页的HTML文件.对不起,如果我听起来很复杂,但是,问题对我来说有点复杂.希望有人可以指出我的理由.

Kri*_*Dey 68

尝试添加z-index:10;.toplink{...}课堂.

  • 使用`z-index`指定分层布局.就是这样的.带有`z-index:x`的元素在`z-index :(小于x)`的元素顶部,并且在元素后面有`z-index :(大于x)`.希望我能成功让你明白. (3认同)

小智 10

我在绝对定位的 div 内有一个按钮,并且遇到了这个问题。z-index还不够,我用了pointer-events: all