Inline labels do not work properly


#1

Consider the following inline labels with right alignment:

<ion-content>
  <div class="list padding">
    <label class="item item-input">
      <span class="input-label">Name</span>
      <input class="text-right" type="text" ng-model="name">
    </label>
  </div>
</ion-content>   

When the screen is narrow (320px), the text in the input is outside of the screen:

http://dl.dropbox.com/u/1893981/Screenshots/epks.png

CodePen here

How could I fix this?


#2

Hmm you can open an issue for this, but I’m not sure what devices these days have a screen smaller that 320px.