0

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

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 来做更好的表格?

4

1 回答 1

0

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

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

这是它的样子:

引导表单验证

于 2013-01-16T19:18:25.197 回答