html 使用定位遇到的问题

html:

<div class="layui-form-item login-form-item code" id="captchaZone" style="position: relative;margin-bottom: 15px;">

  <b class="ico"></b>

  <div class="login-code-box" style="display:block;">

    <input placeholder="请输入验证码" autocomplete="off" data-field="captcha" data-name="验证码" data-valid="{&quot;required&quot;:{&quot;message&quot;:&quot;{name}\u4e0d\u80fd\u4e3a\u7a7a&quot;}}" type="text" name="data[captcha]" value=""/>

    <img width="120" height="36" id="captchaImg" src="/?c=Captcha&type=login" title="点击更换验证码" style=" position: absolute;">

  </div>

</div>

想要的结果是需要验证码和输入验证码框在同一行。但是使用了定位之后位置在input框下方,怎么都弄不上去。

 

解决方法:添加right:0px;top:0px;

改为:<img width="120" height="36" id="captchaImg" src="/?c=Captcha&type=login" title="点击更换验证码" style=" position: absolute;right:0px;top:0px;">

 

posted @ 2018-07-11 17:44  liuqd001  阅读(218)  评论(0编辑  收藏  举报