Boostrap 4-具有一行和类table-sm的表工具提示位置问题

Question

我发现工具提示在只有一行并且具有table-sm类的表中的位置存在问题

<!-- TOOLTIP POSITION OK -->
<div class="table-responsive text-nowrap">
   <table class="table table-striped table-bordered">
      <thead>
        <tr>
           <th>First</th>
           <th>Last</th>
        </tr>
       </thead>
      <tbody>
        <tr>
          <td><span title="Foo tooltip">Foo</span> </td>
          <td><span title="Bar tooltip">Bar</span> </td>
        </tr>
      </tbody>
     </table>
  </div>

  <!-- TOOLTIP POSITION PROBLEM -->
  <div class="table-responsive text-nowrap">
      <table class="table table-striped table-bordered table-sm">
         <thead>
            <tr>
             <th>First</th>
             <th>Last</th>
            </tr>
          </thead>
          <tbody>
            <tr>
             <td><span title="Foo tooltip">Foo</span> </td>
             <td><span title="Bar tooltip">Bar</span> </td>
            </tr>
           </tbody>
         </table>
        </div>

JS

$( document ).tooltip( { selector: '[title]', container : 'body' });

Bootply

有人知道如何解决吗？
谢谢

Answer 1

尝试将boundary选项设置为viewport

Bootply