css - 如何强制 Twitter Bootstrap .dl-horizo​​ntal DT 内容换行而不是截断？

Question

Bootstrap 具有很好的水平定义列表样式，但我希望 DT 内容换行，而不是被截断。

我知道他们的base.css page他们说:“注意!水平描述列表会截断太长而无法放入左列的术语，修复文本溢出。”

有人知道解决这个问题的方法吗？

这是我一直在努力但没有成功的现成的 bootstrap CSS:

.dl-horizontal {
  *zoom: 1;
}
.dl-horizontal:before,
.dl-horizontal:after {
  display: table;
  content: "";
  line-height: 0;
}
.dl-horizontal:after {
  clear: both;
}
.dl-horizontal dt {
  float: left;
  width: 160px;
  clear: left;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

我的问题与这个问题类似，如果有帮助的话: Prevent Twitter bootstrap empty <dd> filling with next <dd> value

提前致谢!

Answer 1

在 Bootstrap CSS 引用之后添加 CSS 覆盖

.dl-horizontal dt 
{
    white-space: normal;
    width: 200px; 
}