html - 在 Bootstrap 中创建类似表格的表单

Question

我有一个应该如下所示的表单:

Label:         <input field> Explanation of this field
Another Label: <input field> Lengthy explanation, must wrap.

我正在尝试在 Twitter Bootstrap 中执行此操作而不使用实际的 <table> .表格可以防止字段在窄屏幕(如移动设备)上换行。

标准的 Bootstrap 语法是这样的:

<label>Label name</label>
<input type="text" placeholder="Type something…">
<span class="help-block">Example block-level help text here.</span>

有什么方法可以让这些字段横向移动吗？ “form-inline”类没有削减它，因为标签没有排列，“form-horizo​​ntal”类没有工作，因为我无法让 class="help-block"放置右侧的帮助文本。

也许我缺少一个技巧？或者第三方的 CSS 来做更好的形式？

Answer 1

给你，试试这个(只使用 Bootstrap 类)http://jsfiddle.net/jonschlinkert/pngWh/11/

(只需删除 .warning、.info、.error、.success 类即可删除验证状态。我将它们留在那里，以便更容易将我的示例与文档相关联)

这是它的样子: