Question

所以我已经阅读了关于bootstrap 3的所有文档并完成了一些谷歌搜索，但我似乎无法找到解决方案。我有3列，第一列和最后一列包含具有功能类的div。单击这些时，工具提示显示。非常好，全部工作（仅在当前示例中设置推送通知和应用程序共享功能），但工具提示仅显示在第一个功能上方，而不是直接位于点击的功能上方。

实施例： http://madmantis.co.uk/buy-an-app/repos/front-end/mint-theme/ - 向下滚动到功能部分。

代码（部分）： HTML：

<div class="col col-lg-4 features">

        <div class="feature" data-toggle="tooltip" title="Push notifications allow you to send instant messages directly to your customer’s phone, placing your brand firmly in the palm of your customers hands">
            <div class="col col-lg-8">
                <h3>Push Notifications</h3>
                <p>Reach your customers with adverts and special offers</p>
            </div>
            <div class="col col-lg-4 icon">
                <i class="fa fa-info fa-3x"></i>
            </div>
        </div>

        <div class="feature" data-toggle="tooltip" title="Encourage your customers to share your app, spreading the word and taking your brand viral.  Offer a referal reward or discount when customers send your app to their friends.">
            <div class="col col-lg-8">
                <h3>App sharing</h3>
                <p>Help your customers spread the word with the push of a button</p>
            </div>
            <div class="col col-lg-4 icon">
                <i class="fa fa-share-square fa-3x"></i>
            </div>
        </div>

JS：

$('.features .feature').tooltip({
            container: 'body',
            trigger: 'click'
        });

Answer 1

div .feature在渲染时没有高度。

如果您将类row添加到每个div，它应该可以工作。像这样：

    <div class="feature row" data-toggle="tooltip" title="Push notifications allow you to send instant messages directly to your customer’s phone, placing your brand firmly in the palm of your customers hands">
        <div class="col col-lg-8">
            <h3>Push Notifications</h3>
            <p>Reach your customers with adverts and special offers</p>
        </div>
        <div class="col col-lg-4 icon">
            <i class="fa fa-info fa-3x"></i>
        </div>
    </div>

Bootstrap工具提示奇怪的位置

1 个答案: