Ionic-framework: bug: bug: placeholder vertical alignement

[5im0n]

Type: bug

Platform: desktop browser

Their is an alignement problem with the placeholder on inline label. The placeholder is too hight compare the label.
I seen this problem on Android, Chrome, iOS, but not on Firefox

http://codepen.io/5im0n/pen/KpYGKr

[mhartington]

Hmm tested this in chrome, on a device and wasn't able to get the issue. Though this could be attributed to a visual trick on the eyes.

http://codepen.io/mhartington/pen/QbRvBY?editors=010

[5im0n]

Hey @mhartington
Indeed in chrome it could be attributed to a visual trick on the :eyes:. But on iOs devices (tested on iPhone 5 - iPhone 6+) it's a little bit more evident.
I'm enclose you a screenshot from an iPhone 6+

Compare to a screenshot from Nexus 9

It's maybe due to the different font size between the label (16px) and the placeholder (14px)

[mhartington]

Cool thanks for the screen shots. Will look into this.

[jgw96]

Hello all! Is this still an issue with the latest version of ionic? Thanks!

[jgw96]

Hello all! As it seems it has been a while since there was any activity on this issue i will be closing it for now. Feel free to comment if you are still running into this issue. Thanks for using Ionic!

[RobertVelton]

Definitely still running into this issue with text not being vertically aligned within an input box on the latest version of ionic 1.

[crazybob9]

+1

[Asterodeia]

+1
-- edit

I don't know why I got a minus on my response...
I found this solution on stackoverflow
I piked the answer where I put : line-height: normal on the input.
Hope this helps those still experiencing the problem on ionis on ios.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.