无法删除未识别的水平超链接

Question

http://jsfiddle.net/fqnGT/

在上面的小提琴中，我的鼠标光标在按钮的右侧和左侧获得水平的未识别超链接，我不知道为什么。

<a href="newgame.html"><div class="startnewgame">START NEW GAME</div></a>

Answer 1

根据W3C标准，您不应将div放在a标记内。正确的做法是，

<div><a href="newgame.html" class="startnewgame">START NEW GAME</a></div>

查看您的演示http://jsfiddle.net/fqnGT/2/

Answer 2

您不能在锚标记中使用div。请改用span - http://jsfiddle.net/fqnGT/1/

<强>更新 设置嵌套范围的display: inline-block - http://jsfiddle.net/fqnGT/8/

Answer 3

最简单的方法

编辑

<a href="newgame.html" class="startnewgame">START NEW GAME</a>

http://jsfiddle.net/fqnGT/4/

Answer 4

在您的链接中添加课程：

<a href="newgame.html" class="link">

添加：

a.link{
display: block;
float: left;
margin-left:100px;
}

并编辑：

.startnewgame {
width: 298px;
padding: 20px;
color: white;
background: blue;
font-family: Arial;
font-size: 32px;
font-weight: 900;
}

Answer 5

在startnewgame样式类上覆盖display

display: inherit

编辑:(在带有div的原始资源上）

Answer 6

你可以改变标记和css：

html标记：

<div class="startnewgame"> 
    <a href="newgame.html">START NEW GAME</a>
</div>

CSS：

.startnewgame {
     width: 298px;
     padding: 20px;
     margin-left: 100px;
     background: blue;
     font-family: Arial;
     font-size: 32px;
     font-weight: 900;
}
.startnewgame a {
     color: white;
}
.startnewgame a:hover {
     cursor: pointer;
     color: yellow;
}

Demo Fiddle