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.

```
<div class="container">
      <label for="agitated">Agitated</label>
      <input type="range" min="0" max="10" value="5" id="fader">
      </br>

      <label for="happy">Happy</label>
      <input type="range" min="0" max="10" value="5" id="fader">
      </br>

      <label for="tired">Tired</label>
      <input type="range" min="0" max="10" value="5" id="fader">
      </br>

      <label for="scared">Scared</label>
      <input type="range" min="0" max="10" value="5" id="fader">
    </div>

```