怎么把悬浮固定在自己想要的位置（获取验证码）固定在文本框的上面不动
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="密 码"><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>
最佳答案
0
#box {
width: 11%;
height: 40px;
right: 10px;
margin-top: -54px;
display: compact;
position: relative;
float: right;
}
收获园豆：5
谢谢