html - 新しい行を強制的に css と水平方向に整列させます

Question

これが私の例です：http://jsfiddle.net/SfTuD/1/

HTML:

<label class="longLabel">Create Document</label>

<input class="radioButton" checked="checked" value="true" id="Yes" type="radio"></input>

Allowed    

<input class="radioButton" value="false" id="No" type="radio"></input>

Not Allowed

<span class="description">A user with this permission will be allowed to create new Documents, Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum</span>

CSS:

label {
    min-width:165px;
}
label.longLabel {
    width:165px;
}
input.radioButton {
    margin-right:5px;
}
.description {
    font-style: italic;
    padding-left: 20px;
}

説明範囲をラジオ ボタンの右側に配置したいと思います。つまり、説明の新しい行は「A user...」と揃える必要があります。

display: inline-block を試しましたが、スパン全体が強制的に新しい行になります。

何か案は？

Answer 1

CSS から次の行を削除します。

 display: inline-block;