悬停问题。对齐改变了。它向下移动了

时间:2014-05-19 06:42:44

标签: javascript html css

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>

1 个答案:

答案 0 :(得分:2)

<强> 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;

使其与文本重叠