title: mdl checkbox should be on right for RTL languages
body: <p>I am using mdl-checkbox and a text on the right side of the checkbox.
  I would like to switch the order of these two components in case of RTL languages (text to the left of the checkbox) but I can't move the text to the left (it is always on the right).</p>
  
  <p>I tried many variations of "dir=rtl", direction:rtl, align, etc.. but the text remain on the right side.
  I also tried using some CSS options but I still failed to switch the order.</p>
  
  <pre><code>&lt;label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"&gt;
      &lt;input id="MdlCheckBox" type="checkbox" class="mdl-checkbox__input" /&gt;
      &lt;span class="mdl-checkbox__label"&gt;My Text&lt;/span&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p><a href="https://jsfiddle.net/80mfmnw4/5/" rel="nofollow noreferrer">JSFIDDLE Example</a></p>
  
  <p>How can I easily switch the order between the text and the checkbox without affecting the rest of the page?</p>
  
  <p>All other components on the page behave fine in RTL languages.</p>
  
  <p>Thanks!</p>