时间戳

首页 > 解决方案 > 放大和缩小后输入下降

css - 放大和缩小后输入下降

问题描述

在这里我做了两个简单的输入字段，但是当我放大和缩小页面（Ctrl +鼠标滚轮）时，输入字段会改变位置，输入会向下和向上，为什么会这样？无论我放大还是缩小，如何将它们放在同一个地方？

body {
  width: 870px;
}

#col3 {
  width: 400px;
  float: left;
  /*background-color:#383838;*/
  margin: 20px 10px 10px 30px;
}

form {
  width: 380px;
  margin: auto;
  padding: 5px;
  border: solid 1px white;
}

fieldset {
  margin: auto;
  border: solid 1px #E37222;
  padding-left: 19px;
  padding-top: 15px;
  background-color: #EEEEDD;
}

label {
  display: block;
  width: 70px;
  float: left;
  margin-left: 10px;
}

span {
  margin-left: -16px;
}

legend {
  background-color: #E37222;
  color: white;
}

input.tt {
  outline: 1px solid #909090;
}

.tt {
  margin-top: 8px;
}
<div id="col3">
  <form>
    <fieldset>
      <legend>eeeee</legend>

      <label for="name">
        <span>rrr:</span>
      </label>
      <input class="tt" type="text" size="34" />
      <br />

      <label class="tt" for="email">
        <span>ttt:</span>
      </label>
      <input class="tt" type="text" size="34" />

    </fieldset>
  </form>
</div>

…………………………………………………………………………………………

标签： csshtmlinput

解决方案

删除float:left_<label>

label{
    display:block;
    width:70px;
    margin-left:10px;

}

推荐阅读