Question

只是在一个无用的网站上自娱自乐，练习这个和那个。我遇到了一个问题，链接只能在左侧点击，而不是右侧。

它看起来如何： div，里面有一个标题（2），里面有一个链接

        <div class="button one"><h2><a href="#">example</a></h2></div>

它有一个右边框，一个悬停功能和相当大的宽度。它绝对定位。尝试了一下，想出了下面的代码（这是一个麻烦，对不起）

.button{
position:absolute;
padding:0px;
margin:0px;
width:300px;
height:70px;
background-color:#999999;
border-left:solid 7px #FF6600;
border-bottom:solid 1px #FF6600;
border-top:solid 1px #FF6600;

}

.button h2{
padding:0px;
margin:0px;
text-transform:uppercase;
color:#FFFFFF;
font-size:1,5em;
}
a{
margin:0px;
display:block;
text-decoration:none;
color:#FFFFFF;
padding:20px;

}
a:hover{
background-color:#FF6600;
}

问题：链接仅链接大约1/2宽度。它们的悬停背景颜色会更改整个区域，但仅在鼠标位于该链接区域时才有效。不知道我错过了什么。感谢所有帮助！

对于那些想要查看css和html文件的人，我把它们放在test.rar文件中： http://www.sendspace.com/file/pe42e0

Answer 1

这是因为图片 #content_image_1 位于按钮上方。如果从该图像中删除z-index: 1;，则按钮会按预期工作。虽然按钮后面有你的图像。

需要帮助修复链接的可点击区域

1 个答案: