Browser resize causes placeholder text to move out of input fields

[msandi]

Dragging the right edge of the browser to resize the window causes the placeholder text to move outside the input fields.

After resizing the window, only refreshing the page puts the placeholders back in place.

Changing the position to relative from absolute appears to work, but then when entering text, the placeholder text appears to be getting written over.

Can something be done to handle the resizing and maybe refresh automatically? Or change positioning to relative and still hide the placeholders?

Example before resizing the window:

Example after resizing the window:

Example using relative positioning:

[ginader]

Hi @msandi By default the polyfill should reposition the placeholders after the window got resized. If that doesn't happen there seems to be a bug/collision with your code. Would you mind posting a link to your example? thanks :-)

[msandi]

Yes, I am sure you are right. I created a stripped down version and it did not occur. I'm checking my code now, I'll let you know

[msandi]

I figured out the problem. In my css, I had padding instead of using absolute positioning for my login tags, once I changed that, the placeholder values stay in the inputs.

Thank you!

[ginader]

YAY! thanks @msandi :-)