以下に含まれる jsfiddle では、フッターに 2 つのホバー フォームがあります。「ログイン」にカーソルを合わせると、期待どおりにログイン フォームが表示されます。ただし、ユーザー名入力ボックスにカーソルを合わせると、登録フォームが表示されます。また、フッターの「登録」にカーソルを合わせると、期待どおりに登録フォームが表示されます。ただし、「ユーザー名」ラベルの上にマウスを移動すると、ログイン フォームが表示されます。
Internet Explorer でのみこのエラーが発生します (バージョン 10 を使用しています)。Chrome と FireFox はテスト済みです。IE で互換表示に入ると、この問題はなくなりました。
<body>
<div id="header">
</div>
<div id="middle">
<div id="content">
</div><!--/content-->
</div><!--/middle-->
<div id="footer">
<ul id="footer_row">
<li>login
<ul>
<li ><form name="loginForm" action="redirect.php" method="post">
<label for="inputUser">Username</label> <input id="inputUser" type="text" name="user" maxlength="30" />
<label for="inputPass">Password</label> <input id="inputPass" type="password" name="pass" maxlength="254" />
<input type="checkbox" name="remember" value="yes"> <label for="chkRemember" />Stay signed in</label>
<input type="submit" class="submit-form" value="Submit" />
</form>
</li>
</ul>
</li>
<li>register
<ul>
<li ><form name="registerForm" action="register.php" method="post">
<label for="inputUser" >Username</label> <input id="inputUser" type="text" name="user" maxlength="30" />
<label for="inputEmail" >E-Mail Address</label> <input id="inputEmail" type="text" name="email" maxlength="254" />
<label for="inputPass1" >Password</label> <input id="inputPass1" type="password" name="pass1" maxlength="254" />
<label for="inputPass2" >Password (again)</label> <input id="inputPass2" type="password" name="pass2" maxlength="254" />
<input class="submit-form" type="submit" value="Submit" />
</form>
</li>
</ul>
</li></ul>
</div>
</body>