dd标记内的引导程序缩进不按预期工作

时间:2014-11-12 22:37:36

标签: html css twitter-bootstrap indentation dd

我正在设计(希望我是一名设计师)一个慈善机构的网页 - 这个宪法基本上是我决定在标签中做的标题和信息列表。但是,我似乎无法让元素按照我希望的方式运行,子项比其父元素缩进更多。

Incorrect Indentation

正如你所看到的那样,第4项很好,但是第4.1项应该进一步缩进,而且其中的任何子项(4.1.1)都会再次缩进。

我尝试使用css并创建两个text-indent-n样式,如下所示

.text-indent-4{
    text-indent: 50px;
}

.text-indent-8{
    text-indent: 100px;
}

这样应用没有区别:

<dt data-toggle="tooltip" data-placement="top" title="Register of members">Register of members</dt>
  <dd>17. The board must keep a register of members, setting out </dd>
  <dd  class="text-indent-4">17.1   for each current member:</dd>
  <dd  class="text-indent-8">17.1.1 their full name and address; and</dd>
  <dd  class="text-indent-8">17.1.2 the date on which they were registered as a member of the organisation; </dd>
  <dd  class="text-indent-4">17.2   for each former member - for at least six years from the date on he/she ceased to be a member:</dd>
  <dd  class="text-indent-8">17.2.1 his/her name; and</dd>
  <dd  class="text-indent-8">17.2.2 the date on which he/she ceased to be a member. </dd>
  <dd>18    The board must ensure that the register of members is updated within 28 days of any change:</dd>
  <dd  class="text-indent-4">18.1   which arises from a resolution of the board or a resolution passed by the members of the organisation; or </dd>
  <dd  class="text-indent-4">18.2   which is notified to the organisation.  </dd>
  <dd>19    If a member or charity trustee of the organisation requests a copy of the register of members, the board must ensure that a copy is supplied to him/her within 28 days, providing the request is reasonable; if the request is made by a member (rather than a charity trustee), the board may provide a copy which has the addresses blanked out.</dd>

所以问题是:

1)如何让<dl>的每个子项缩进 2)他们是否可以自动计算<dd>的缩进或者是否必须指定缩进?

1 个答案:

答案 0 :(得分:4)

对此的简单补救措施是用<ul></ul>标签包围子项目,这将根据需要缩进子项目。

感谢您的编辑