ginader / HTML5-placeholder-polyfill

Small and robust polyfill for the HTML5 placeholder attribut.
GNU General Public License v2.0
223 stars 85 forks source link

Placeholder positioning sensitive to CSS layout #30

Open thesheep opened 11 years ago

thesheep commented 11 years ago

The way the generated placeholders are positioned can be corrupted if you have hidden elements in the DOM above the location of the INPUT. For example, I had a long form with some sections of the form displayed using expand/collapse behaviour. All generated placeholders below these sections were positioned incorrectly, outside their INPUT elements.

The best way I have found to fix these issues is to apply position: relative to some container elements within the form.

ginader commented 11 years ago

Do you have a testcase for this issue anywhere?

raldred commented 11 years ago

This may or may not be related, I also have some positioning issues with the polyfill in IE when font-size does not fit perfectly to line-height the vertical position does not appear to take into account the difference. eg. line-height:18px; font-size:16px;

The position of the placeholder overshoots the center by 2px