Bootstrap 3.3.2中的使用media-body 导致文本溢出(Text-Overflow)

前端之家收集整理的这篇文章主要介绍了Bootstrap 3.3.2中的使用media-body 导致文本溢出(Text-Overflow)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

在使用bootstrap进行部署文章列表时,发现medis-body中内容如果含有<p>和<span>标签,文本会溢出

微信截图_20200113144022.png

解决办法:

.media-heading,.media-body > p, .media-body > span {
    word-break: break-word;}

微信截图_20200113144342.png

原因:这是因为bootstrap中display:table-cell导致,如下代码

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


猜你在找的JavaScript相关文章