css – Bootstrap 3.3.2中的媒体列表和文本溢出

我最近将我的项目从Bootstrap 3.2.x更新到3.3.2(最后一个版本),我发现了与 Media Object元素的重要区别.

我想在媒体标题中使用特殊的less mixin .text-overflow()将以下css属性添加到标题中：

.media-heading {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: Nowrap;
}

在Bootstrap 3.2中运行良好(非常好),你可以在下面的plnkr中看到它：Media-List in 3.2

但是,从3.3.x开始,我无法在头文件中使用省略号和文本溢出：Media-List in 3.3.2

你可以比较下图：

那么,我怎样才能在Bootstrap 3.3.x中使用Bootstrap 3.2描述相同的行为？ (例如,它对移动用户非常有用).

更多信息 ：
媒体对象中的布局修改在3.3.0和issue was opened (and closed) about this modification中引入,并且对许多用户产生了影响.
解决方案是将媒体对象(媒体,媒体体)的大小设置为10000px.

解决方法

它看起来像显示：table-cell;在下面的规则是导致问题.重写它应该解决问题.

.media-left,.media-right,.media-body {
  display: table-cell; /* Here is the issue */
  vertical-align: top;
}

添加下面的代码段似乎恢复了3.2的功能,但谁知道这可能会产生3.3.1代码的其他问题…

.media-left,.media-body {
  display: block;
}

此外,这不适用于最新版本(目前为3.3.2),因为.media-body的宽度由于某种原因设置为10000px …将其更改为宽度：auto加上面的更改似乎使其工作在3.3.2.但同样,我不知道这可能会产生什么其他问题.

.media-body {
  width: 10000px;
}