0

我经常遇到表单具有可选字段的应用程序。当这些记录显示在“显示”视图中时，定义“折叠”在一起并且不与它们各自的标签对齐。例如，如果我有 3 个字段，它们应该如下所示：

Phone:  312-555-1212
FAX:
Mobile: 312-555-1234

他们最终看起来像这样：

Phone:  312-555-1212
FAX:    312-555-1234
Mobile:

我想出了一个技巧，可以在每个关闭“dd”标签之前抛出一个不间断的空格（%nbsp），但这似乎不是很干。

有没有更好的方法来用 CSS 做到这一点？

这是我的 Rails/HTML 代码，因为它带有非中断空格。它有效，但是，我正在尝试看看是否有更好的方法。

<dt>FAX:</dt>
<dd><%= number_to_phone(@user.fax, :area_code => true) %> &nbsp;</dd>

<dt>Pager:</dt>
<dd><%= number_to_phone(@user.pager, :area_code => true) %> &nbsp;</dd>

<dt>Mobile:</dt>
<dd><%= number_to_phone(@user.mobile, :area_code => true) %> &nbsp;</dd>

因此，通过在关闭“dd”标签之前放置不间断空格，我欺骗系统认为字段中没有任何内容并将下一个项目放在下一行而不是移动它向上，所以它不再与它的标签对齐。

4

1 回答 1

1

我认为您在滥用定义列表。你通常渲染像（蜂蜜的 dd 是空的）：
定义列表

所以你必须在你的css中使用一些定位来对齐“定义”
使用表格来显示表格，标签来显示标签和css来格式化它！

于 2013-05-29T21:53:15.280 回答