首页新闻找找看学习计划

怎么把悬浮固定在自己想要的位置(获取验证码)固定在文本框的上面不动

0
悬赏园豆:5 [已解决问题] 解决于 2015-09-09 15:14

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>灰色免费注册</title>
<style type="text/css">
*{ margin:0px; padding:0px; list-style-type:none;}
#enroll{ width:100%; height:auto;}
#n_enroll{ width:100%; height:50px; background-color:#333333; line-height:50px; overflow:hidden;}
#n_enroll ul{width:100%;}
#n_enroll ul li{ width:45%; float:left; font-size:16px; color:#FFF;}
#n_enroll ul li.n_nenroll{ float:left;width:45%; margin-left:60px;}
#Tile{ width:100%; height:200px; overflow:hidden; background-color:#fafafa; border-bottom:1px solid #c1c1c1;}
#Tile a{ background:url(image/1.jpg) no-repeat; width:900px; margin:0px auto; height:200px; display:block;}
#Name{ width:100%; height:155px; margin-top:2px; overflow:hidden;}
#Name input{ width:90%; height:50px; line-height:50px; margin-left:80px; border-top:0px; border-left:0px; border-right:0px;}
#box{ width:11%; height:40px;right:10px; margin-top:-54px; display:compact; position:fixed; }
.box{width:50%;height:40px; -moz-border-radius:10px;-webkit-border-radius:10px;border-radius: 10px; margin-top:5px; border:2px solid #4bb3bb; color:#4bb3bb; text-align:center; line-height:40px;}
#enrolls{ width:100%; height:500px; background-color:#fafafa; border-top:1px solid #c1c1c1; overflow:hidden;}
#enrolls p{ width:22%; height:30px; line-height:30px; color:#c1c1c1; float:right;}
#bos{ width:100%; height:60px;  margin-top:80px;}
.bos{width:95%;height:50px; -moz-border-radius:10px;-webkit-border-radius:10px;border-radius: 10px; margin-top:5px; margin-left:43px; background-color:#c1c1c1; color:#ffffff; text-align:center; line-height:50px;}
#square{ width:15%; height:30px; float:right; overflow:hidden;}
.square{width:10%;height:25px; -moz-border-radius:10px;-webkit-border-radius:10px;border-radius: 10px; margin-top:2px; border:1px solid #4bb3bb; color:#ffffff; text-align:center; line-height:25px;}
#square span{ float:right; margin-top:-25px; margin-right:45px; color:#c1c1c1;}
</style>
</head>
<body>
    <div id="enroll">
        <div id="n_enroll">
            <ul>
                <li><i class="am-icon-angle-down am-icon-fw"></i><span>返回</span></li>
                <li class="n_nenroll"><span>免费注册</span></li>
            </ul>
        </div>
        <div id="Tile">
            <a href="#"></a>
        </div>
        <div id="Name">
            <input type="text" class="am-form-field" placeholder="手机号码"><br />
            <input type="text" class="am-form-field" placeholder="密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码"><br />
            <input type="text" class="am-form-field" placeholder="手机验证码">
        <div id="box">
            <div class="box">获取验证码</div>
        </div>
        </div>
        <div id="enrolls">
        <p>60秒内输入有效,计时完毕后可再次获取验证码</p>
        <div id="bos">
            <div class="bos">登录</div>
        </div>
        <div id="square">
            <div class="square"></div><span>我已阅读并同意《用户须知》</span>
        </div>
        </div>
    </div>
</body>
</html>

div
一色的彩虹的主页 一色的彩虹 | 初学一级 | 园豆:199
提问于:2015-09-09 14:41
< >
分享
最佳答案
0

#box {
width: 11%;
height: 40px;
right: 10px;
margin-top: -54px;
display: compact;
position: relative;
float: right;
}

收获园豆:5
✎﹏ℳ๓₯㎕ღ | 小虾三级 |园豆:1497 | 2015-09-09 15:05

谢谢

一色的彩虹 | 园豆:199 (初学一级) | 2015-09-09 15:12
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册