title: CSS: .table-responsive class messes up tooltip's content [fiddle provided]
body: <p>I've got this problem - after adding <code>.table-responsive</code> class the table header tooltips got lost <code>overflow-x: auto</code> - Setting it off makes it alright but disables the responsivness of the table.</p>
  
  <p>I've created code snippet to show you</p>
  
  <p><em><a href="https://jsfiddle.net/kristjanrei/74aa8x6u/" rel="nofollow noreferrer">https://jsfiddle.net/kristjanrei/74aa8x6u/</a></em></p>
  
  <p>Default code for tooltip</p>
  
  <pre><code>.container {
    padding: 200px;
  }
  .custom-tooltip-hover {
      position: relative;
  }
  
  .custom-tooltip { /* hide and position tooltip */
      position: absolute;
      bottom: 100%;
      left: 0px;
      background-color: #000;
      color: #fff;
      line-height: initial;
      visibility: hidden;
      border: 1px solid #fff;
      text-align: left;
      padding-left: 8px;
      padding-right: 8px;
      padding-top: 4px;
      padding-bottom: 4px;
      margin-bottom: 4px;
      z-index: 110;
      transition-delay: 0.33s;
      font-size: 13px;
      font-weight: initial;
      word-break: inherit; 
      font-size: 12px;
      white-space: normal;
  }
  
  .custom-tooltip.left {
      left: initial;
      right: 0px;
  }
  
  .custom-tooltip:after {
      content: '';
      position: absolute;
      top: 100%;
      left: 12%;
      width: 0; height: 0;
      border-top: 8px solid #000000;
      border-right: 8px solid transparent;
      border-left: 8px solid transparent;
  }
  
  .custom-tooltip.left:after {
      left: initial;
      right: 12%;
  }
  
  .custom-tooltip-hover:hover .custom-tooltip {
      visibility: visible;
      display: inline;
      transition-delay: 0.88s;
      -webkit-transition-delay: 0.88s; /* Safari */
  }
  
  .break-tooltip {
      word-break: break-all;
  }
  </code></pre>
  
  <p>A snippet from jsfiddle of a broken tooltip.
  <a href="https://i.stack.imgur.com/wInUu.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wInUu.png" alt="enter image description here"></a></p>
  
  <p>Way it works every where else </p>
  
  <p><a href="https://i.stack.imgur.com/CCCD0.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CCCD0.png" alt="enter image description here"></a></p>