twitter-bootstrap – Bootstrap工具提示需要单行

前端之家收集整理的这篇文章主要介绍了twitter-bootstrap – 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>

解决方法

.tooltip-inner {
  white-space:nowrap;
  max-width:none;
}

在Bootstrap CSS之后将其添加到您的CSS.然而,使用右侧的悬停,即使是正确的自动,将会在较小的视口上关闭屏幕,但是由于较小的视口通常会触摸,因此悬停可能会使双重工作.我通常使用脚本检测IOS,Android和Windows手机的触摸,然后只使用无触摸设备上的工具提示,因此这不会干扰用户轻击.

猜你在找的Bootstrap相关文章