Number input width overflow on window resize

[mohamedazherParticipant]

Hi,
There seems to be an issue with the number input when used with width 100% and placed inside a fieldset tag.

Everything loads ok, but when you quickly resize the window to a smaller size, (or orientation change from landscape to portrait in case of mobile) The number input seems to overflow and not adjust itself to the width of the window.

This only happens with number input.

Please check this fiddle http://jsfiddle.net/mohamedazher/Kgp4M/. When you try and resize the browser slowly, the widget seems to resize, but when you resize it fast, the widget would fail to do so. The same happens when you restore your browser to a smaller size.

Also as mentioned this only happens if the widget is wrapped inside a fieldset tag. It works fine when you remove the fieldset tag.

-Mohamed Azher

[Peter StoevKeymaster]

Hi Mohamed Azher,

The problem is in the fieldset tag which fails to resize itself and so do the widgets that depend on its width i.e are with fluid width set to 100%

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[mohamedazherParticipant]

Hi,
Thanks for your reply. But as I mentioned, this seems to only happen with Number Input widget and not with anything else. Even the date time input seems to work fine. (You can remove the Number input from the fiddle and try it yourself)

Also adding a lot of widgets to the fieldset does not seem to affect but this breaks as soon as you add the Number Input, which indicates the problem lies in the widget or its CSS?

There is something with the widget which is causing issues with the fieldset tag.

Regards,
Mohamed Azher

[Author]

Posts