Dropdown doesn't render well with RTL direction

[lkovaleva]

Description

When a paper-dropdown-menu is enclosed in a dir="rtl" element, its floating label is positioned off-center, and the selected element is left-aligned.

Expected outcome

I would expect the label to float to the top-right corner and the selection to be right-aligned.

Actual outcome

The label is somewhere off-center, so it's clearly not just the LTR positioning, but rather neither here nor there. The selection is left-aligned.

Steps to reproduce

Render this HTML and select an item in the dropdown.

<div dir="rtl">
  <paper-dropdown-menu label="Dinosaurs">
    <paper-menu class="dropdown-content">
      <paper-item>allosaurus</paper-item>
      <paper-item>brontosaurus</paper-item>
      <paper-item>carcharodontosaurus</paper-item>
      <paper-item>diplodocus</paper-item>
    </paper-menu>
  </paper-dropdown-menu>
</div>

[bennypowers]

here's how it looks with some rtl text content.

[DanielTal]

exactly the same problem

[MWalid]

same here ...