Is it possible to have a progress bar move from right to left based on a negative value in Twitter Bootstrap?

I actually figured it out! :) Turned out to be really easy, and indeed the answer was found in the previously linked post;

    <li>Speed<span class="pull-right"><em>@Math.Round(DepthValue, 2) m/min</em></span>
        <div class="progress progress-success">
            <div class="bar" style="width: @Model.SpeedRangePercentage%; display: block; float: right;"></div>
        </div>
    </li>

Adding styles "display: block;" and "float; right" caused the bar to move from right to left.

Further to the accepted answer, in Bootstrap 4+, the progress bar now uses Flex, and floating won't work.

So now, do the following (add "justify-content-end" ):

<div class="progress justify-content-end">
  <div class="progress-bar progress-bar-striped" role="progressbar" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"></div>
</div>

In Bootstrap 4 just change the div with class .progress to flex-direction: row-reverse or use the flex-row-reverse helper class (as denoted below):

<div class="progress flex-row-reverse">
  <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
</div>