如何调整输入字段旁边的标签？

Answer 1

label {
  display: inline-block;
  width: 150px;
  /* Set a width that accommodates your longest label */
  text-align: right;
  margin: 5px 10px 5px 0;
  /* Adjust the right margin to space out the label from the input */
}

input {
  border: 1px solid black;
  border-top: 3px solid grey;
  border-left: 3px solid grey;
  margin: 5px 0;
  /* Adjust the top and bottom margin as needed */
  display: inline-block;
  width: 200px;
  /* Set a width that works for your layout */
}

<div>
  <label for="uname">Username</label>
  <input type="text" id="uname" name="uname">
</div>

<div>
  <label for="pwd">Password</label>
  <input type="password" id="pwd" name="pwd">
</div>

<div>
  <label for="cpwd">Confirm Password</label>
  <input type="password" id="cpwd" name="cpwd">
</div>

从两个元素中删除

float: left;

样式，因为使用

inline-block

时不需要它。