title: Are the radio buttons and text in proper order within a Right-To-Left (rtl) HTML area?
body: <p>I noticed an issue when using right-to-left-based radio buttons on the same line in HTML. The radio "button" does not line up with the associated text as I would expect; the radio for group 1 is next to the label for group 4, but the other buttons seem to line up as I would expect.  This happens on multiple browsers.  </p>
  
  <p>Is this expected behavior?  Would a right-to-left based language person understand this?</p>
  
  <p>You can play with the code here: <a href="http://jsfiddle.net/6U9fw/" rel="nofollow">http://jsfiddle.net/6U9fw/</a></p>
  
  <pre><code>&lt;div dir="rtl"&gt;
  &lt;input name="group" id="group1" type="radio" value="group1" /&gt;
  &lt;label for="group1"&gt;group1&lt;/label&gt;
  &lt;input name="group" id="group2" type="radio" value="group2" /&gt;
  &lt;label for="group2"&gt;group2&lt;/label&gt;
  &lt;input name="group" id="group3" type="radio" value="group3" /&gt;
  &lt;label for="group3"&gt;group3&lt;/label&gt;
  &lt;input name="group" id="group4" type="radio" value="group4" /&gt;
  &lt;label for="group4"&gt;group4&lt;/label&gt;
  &lt;/div&gt;
  &lt;input type="button" onclick="alert($('input[type=radio]:checked').val())" value="click" /&gt;
  </code></pre>