title: Adding label to the end of HTML Range slider
body: <p>I'm currently implementing a range slider and have a label at the start of the slider which is positioned just above the slider. This label represents the low end of the scale. Now i need to add a label in the same position at the end of the slider to represent the highest end of the scale. However, i can only get the label to appear at the start of the scale but underneath. I'm using Bootstrap for CSS.</p>
  
  <pre><code>&lt;div class="container"&gt;
        &lt;label for="agitated"&gt;Agitated&lt;/label&gt;
        &lt;input type="range" min="0" max="10" value="5" id="fader"&gt;
        &lt;/br&gt;
  
        &lt;label for="happy"&gt;Happy&lt;/label&gt;
        &lt;input type="range" min="0" max="10" value="5" id="fader"&gt;
        &lt;/br&gt;
  
        &lt;label for="tired"&gt;Tired&lt;/label&gt;
        &lt;input type="range" min="0" max="10" value="5" id="fader"&gt;
        &lt;/br&gt;
  
        &lt;label for="scared"&gt;Scared&lt;/label&gt;
        &lt;input type="range" min="0" max="10" value="5" id="fader"&gt;
      &lt;/div&gt;
  </code></pre>