values-rtl-ref.html

Enable keyboard shortcuts

<!DOCTYPE html>

<html>

  <link rel='stylesheet' href='resource://reftest/progress.css'>

  <style>

    div:nth-child(1) > .progress-bar { width: 100%; }

    div:nth-child(2) > .progress-bar { width: 0%; }

    div:nth-child(3) > .progress-bar { width: 10%; }

    div:nth-child(4) > .progress-bar { width: 50%; }

    div:nth-child(5) > .progress-bar { width: 0%; }

    div:nth-child(6) > .progress-bar { width: 100%; }

    div:nth-child(7) > .progress-bar { width: 42%; }

    div:nth-child(8) > .progress-bar { width: 100%; }

    div:nth-child(9) > .progress-bar { width: 100%; }

    div:nth-child(10) > .progress-bar { width: 10%; }

  </style>

  <body dir='rtl'>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

    <div class="progress-element">

      <div class="progress-bar">

      </div>

    </div>

  </body>

</html>