1

我有一个<dl>并且<dd>我正在尝试将其转换为表格单元格,但我无法正确显示宽度。

外部<dl>是 100%,而<dt>'s 是 20% 和 80%。为什么<dt>每行一起显示的不是外部宽度的 100%<dl>

我应该看到的只有红色和蓝色,没有黄色

这是我的小提琴-感谢您的帮助

http://jsfiddle.net/35Gmm/2/

4

3 回答 3

2

使用这个 css 这将工作正常DEMO HERE

dl{
   display:table;
}
于 2013-09-17T10:29:17.130 回答
2

您需要将显示切换到table定义列表上

dl{
   display:table;
}

并且可能想将一个dd转换为dt

    <dl>
      <dt>hot drink</dt>
      <dd>cold drink</dd>
    </dl>

    dl > dt {
        background:red;
        width: 20%;
    }

    dl > dd {
        background:blue;
        width: 80%;
    }

工作示例

但是,如果您的数据在语义上不适合它,为什么要使用定义列表(术语列表 ( dt),然后您提供对 ( ) 的解释)?dd(或者小提琴只是一些随机样本数据?)

于 2013-09-17T10:33:25.183 回答
-2

将 dl > dd:nth-child(2) 更改为 dl > dd:nth-child(1)

它会起作用的。

于 2013-09-17T10:23:14.030 回答