单选按钮和标签显示在同一行

  • Z时代
  • 2024-01-10
  • 分类：问答

为什么我的标签和单选按钮不会停留在同一行，该怎么办？

这是我的表格：

<form name="submit" id="submit" action="#" method="post">
            <?php echo form_hidden('what', 'item-'.$identifier);?>
            <label for="one">First Item</label>
            <input type="radio" id="one" name="first_item" value="1" />
            <label for="two">Second Item</label>
            <input type="radio" id="two" name="first_item" value="2" />             <input class="submit_form" name="submit" type="submit" value="Choose" tabindex="4" />
            </form>

回答：

如果您使用的是我在此问题中提出的HTML结构，则只需将标签浮动并输入到左侧，然后调整填充/边距，直到所有内容对齐为止。

是的，您需要使单选按钮具有旧IE的类名。并有 所有 他们在同一行，据我连接到上面的标记，它会像这样：

fieldset {
      overflow: hidden
    }
    .some-class {
      float: left;
      clear: none;
    }
    label {
      float: left;
      clear: none;
      display: block;
      padding: 0px 1em 0px 8px;
    }
    input[type=radio],
    input.radio {
      float: left;
      clear: none;
      margin: 2px 0 0 2px;
    }
<fieldset>
      <div class="some-class">
        <input type="radio" class="radio" name="x" value="y" id="y" />
        <label for="y">Thing 1</label>
        <input type="radio" class="radio" name="x" value="z" id="z" />
        <label for="z">Thing 2</label>
      </div>
    </fieldset>

以上是 单选按钮和标签显示在同一行 的全部内容， 来源链接： utcz.com/qa/434778.html

回到顶部