javascript - 悬停问题。对齐方式改变了。它向下移动

Question

http://jsfiddle.net/mah2806/VcnLk/

我应该怎么做才能使表格在我覆盖它时不影响单词测试测试。我希望它像重叠测试测试这个词一样

我的 HTML

<form>
<p id="login">     
    <span class="label">Login Here</span>       
    <span id="loginForm">        
        <span class="form-elements">
            <span class="form-label">Name:</span>
            <span class="form-field"><input type="name" /></span>                        </span>        
        <span class="form-elements">
            <span class="form-label">Password:</span>
            <span class="form-field"><input type="password" /></span>                    </span>        
        <span class="form-elements">
            <span class="submit-btn"><input type="submit" value="Submit" /></span>     
        </span>

    </span>          
</p>
</form>


<p>TESTING TESTING</p>

Answer 1

DEMO

#loginForm {
display: none;
background: #ccc;
width: 250px;
height: 100px;
padding: 20px;
color: #333;
z-index: 99;
position: absolute;
}

这样就可以了。用上面的代码替换你的#loginForm。

我已经添加了

 z-index: 99;
 position: absolute;

使其与文字重叠