html - 在与上面相同的行中缩进输入文本

Question

demo

我有以下 html...

<div>
<input type="radio" value="some value">some text here<br />
<input type="radio" value="some value">some text here and long<br />
</div>

div 的宽度为 110 像素。当某些文本位于下方时，它应该像这样位于同一行。

o some text
o some text
  and logn

Answer 1

这可以通过在您的代码中添加一些 CSS 来完成。

HTML:

<div>
    <input type="radio" value="some value" />
    <label>some text here</label>
    <br />
    <input type="radio" value="some value" />
    <label>some text here and long</label>
    <br />
</div>

CSS:

div {
    width: 110px;
}
input[type="radio"] {
    float: left;
}
label {
    float: left;
    width: 80%;
}

检查这个JSFiddle