html - iOS设备上的CSS填充/边距问题

Question

当我在iphone(iphone 6，ios 8)中查看以下结果时，加载程序略微位于按钮上方，但是当我使用chrome移动模拟器检查时看不到该结果。我不知道该如何解决，您认为可能是什么原因造成的？

img.loader {
    text-align: center;
    width: 20px;
    margin: auto;
    display: block;
    position: absolute;
    right: 15px;
    top: 10px;
}
button {
    width: 100%;
    padding: 12px;
    background: #4aa3df;
    color: #fff;
    border: none;
    font-size: 14px;
    margin-bottom: 10px;
    cursor: pointer;
    box-sizing: border-box;
}
.submitBtnWrap {
    position: relative;
}

<br>
<br>
<div class="submitBtnWrap">
    <button id="login_submit" class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
    <img src="http://i.imgur.com/ScvlxYo.gif" class="loader">
</div>

Answer 1

如果您像在Example中那样直接使用float怎么办:

img.loader {
  text-align: center;
  width: 20px;
  float:right;
  margin:0;
}
button {
  width: 100%;
  padding: 8px;
  line-height:20px;
  background: #4aa3df;
  color: #fff;
  border: none;
  font-size: 14px;
  vertical-align:middle;
  cursor: pointer;
  box-sizing: border-box;
}
.submitBtnWrap {
  position: relative;
}