Question

我的标签在一行，文字在下一行。我怎么能修改CSS以使它们在同一行？我已经尝试了一些基于其他帖子的浮点数，但它们仍然在不同的行上。

＆＃13;

.indentColumn {
  width: 71px;
  padding-top: 5%;
}

.labelColumn {
  width: 71px;
  margin-left: 15%;
}

.inputForm {
  margin-left: 30%;
}

＆＃13;

<div class="indentColumn">
  <div class="labelColumn">
    <div class="inputForm">
      <span class="secNav">
        <label display:inline-block; for="username">#springMessageText("idp.login.username", "User ID:")
        </label>
        <input class="fieldColumn" display: inline-block; id="username" name="j_username" type="text" size="20" maxlength="64" minlength="6"
                	value="#if($username)$encoder.encodeForHTML($username)#end">
      </span>
    </div>
  </div>
</div>

＆＃13;

感谢大家的帮助。我删除了所有div，显示以及文本框中的类，现在它们在同一行。主要问题似乎是文本框中的类，因为只有在我删除它之后它们才出现在同一行。

我还发现有一个表格div设置为250px，导致文本字段在有左边距时进入下一行。一旦我删除了它，事情开始变得更好。

Answer 1

如果您希望它们位于同一条线上，请将它们放入宽度超过71像素的容器中。

71像素的空间并不能并排放置。

Answer 2

CSS

label{
   display:inline-block;
}

并删除<label display:inline-block; ... /> - 错误的

如何让标签和文字出现在同一行

2 个答案: