开箱即用的文字

Question

我正在使用Twitter引导程序和CSS来设置下拉列表。我有一个浮动在左边的子元素，然后是文本流向它的右边。不幸的是，文本不会在包含框内流动并溢出。

我不确定这是一个Twitter引导程序问题还是只是一个CSS问题（最终我知道一个CSS，但是因为我正在使用该框架，所以值得将其标记为Twitter Bootstrap）。

我尝试了几种组合，显然不是正确的组合来实现我追求的行为。有谁知道如何解决这一问题？问题的一个工作示例如下：

http://ec2-54-215-108-9.us-west-1.compute.amazonaws.com/ （点击右侧的国际体操运动员链接）

以下是展示此问题的屏幕截图。 谢谢，

卡尔..

Answer 1

因为TWBS中的下拉列表中的链接有white-space: nowrap;。

我能想到的最简单的解决方案是创建自定义CSS类：

.dropdown-menu > li > a.btn-wrap {
    white-space: normal;
}

然后将class="btn-wrap"添加到您的<a>元素

Answer 2

.dropdown-menu > li > a ,
.btn.btn-default.btn-large.btn-left > span {
  white-space: normal;
}

1. 我还会减少标签上的行高。
2. 降低[.live-mon]
的高度
3. 删除标签上的高度。

4. 增加标签上的填充顶部和底部。

   .intl-link li a {
     overflow: hidden;
   }
   .intl-link li a {
     line-height: 19px;
   }
   .dropdown-menu.intl-link > li > a {
    padding: 7px 20px;
   }
   .live-mon {
    display: block;
    height: 62px;
    width: 92px;
   }
   

你会得到这样的东西：