上記のフィドルでは、マウスカーソルがボタンの左右に水平の未確認のハイパーリンクを取得します。理由はわかりません。
<a href="newgame.html"><div class="startnewgame">START NEW GAME</div></a>

上記のフィドルでは、マウスカーソルがボタンの左右に水平の未確認のハイパーリンクを取得します。理由はわかりません。
<a href="newgame.html"><div class="startnewgame">START NEW GAME</div></a>

W3C 標準に従って、タグdiv内に配置しないでください。a適切な方法は、
<div><a href="newgame.html" class="startnewgame">START NEW GAME</a></div>
デモをチェックしてくださいhttp://jsfiddle.net/fqnGT/2/
リンクにクラスを追加します。
<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;
}
最も簡単な方法
編集
<a href="newgame.html" class="startnewgame">START NEW GAME</a>
スタイルstartnewgameクラスでオーバーライドdisplay
display: inherit
編集:(divを含む元のソースで)