title: Tick label position of seiyria/bootstrap-slider are not correct
body: <p>I am using seiyria bootstrap slider in which tick labels are dynamic. Here you can see the ticks are correctly aligned but their labels are not.</p>
  
  <p>following is the sample markup</p>
  
  <pre><code>&lt;div class="container"&gt;
  &lt;div class="examples"&gt;
      &lt;div class='slider-example'&gt;
           &lt;h3&gt;Example 13:&lt;/h3&gt;
  
          &lt;p&gt;Using ticks.&lt;/p&gt;
          &lt;div class="well"&gt;
             &lt;input id="ex13" type="text" data-slider-ticks="[100, 150, 180, 300, 400]"  data-slider-ticks-labels='["$100", "$150", "$180", "$300", "$400"]' /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://jsfiddle.net/Anuj_Kumar/qn3u9orj/11/" rel="nofollow noreferrer">Here is a jsFiddle</a> showing the issue</p>
  
  <p>Here is an image to show the issue:</p>
  
  <p><a href="https://i.stack.imgur.com/vosG7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vosG7.png" alt="enter image description here"></a></p>