Twitter bootstrap 引导工具提示需要在单行中

我已经创建了一个工具提示使用引导下拉控制。它显示工具提示。 但是，由于此控件绑定在

class=“col-sm-4”中，因此工具提示文本被拆分为新行。但我希望用一行字来说明这一点。有什么想法吗

<div class="col-sm-4">
                <select class="form-control" id="ddlSchoolAttended" data-toggle="tooltip" data-placement="right" title="Some tooltip 2!Some tooltip 2!Some ">
          <option value="08">08 -Year 8 or below</option>
    <option value="09">09 -Year 9 or equivalent</option>
    <option value="10">10 -Completed Year 10</option>
    <option value="11">11 -Completed Year 11</option>
    <option value="12">12 -Completed Year 12</option>
    <option selected="selected" value="">--Not Specified--</option>
          </select><br/>
</div>


08-8年级或以下
09年9年级或同等学历
10-完成第10年
11-完成第11年
12-完成第12年
--未指定--



在引导CSS之后将其添加到CSS中。但是，在较小的视口上使用向右悬停（甚至向右自动）将关闭屏幕，但由于较小的视口通常是触摸式的，悬停可能会使这需要双击才能工作。我通常使用一个脚本来检测IOS、Android和WindowsMobile的触摸，然后只在非触摸设备上使用工具提示，所以这不会干扰用户点击
 尽管克里斯蒂娜的答案有效，但它只能解决问题，并可能在其他地方产生其他问题。在引导文档中提到：

按钮组、输入组和表格中的工具提示需要特殊设置
在.btn组或.input组中的元素或与表格相关的元素上使用工具提示时，必须指定选项
container:'body'
，以避免不必要的副作用（例如触发工具提示时元素变宽和/或失去圆角）

看

因此，您只需添加
容器：“body”
如下所示：

$(function () {
    $('[data-toggle="tooltip"]').tooltip({container: 'body'})}
);

希望这有帮助

$(function () {
    $('[data-toggle="tooltip"]').tooltip({container: 'body'})}
);