Viewport Resize Causes Issues in Fluid Texbox

[poeziafree]

Hello,

I have two fluid textboxes aligned horizontally.

Resize of viewport/parent causes issues with the width of the textbox.

Please see the example and the screenshot below: http://jsfiddle.net/ogszh82p/2/

Screenshot: https://paste.pics/LBVU7

What could be the problem?

Thanks

[jarry]

Please try this code.

Code:

<div class="f-row">
	<input class="easyui-textbox" label="Test1:" style="width: 100%;">
	<input class="easyui-textbox" label="Test2:" style="width: 100%;">
</div>

[poeziafree]

Thanks, Jarry!

In this case, on resizing the viewport, the first textbox inner typable area is smaller than the second one.

See the screenshot: the selected area with the red arrow shows that this area is not typable.

Screenshot: https://snipboard.io/736zEe.jpg

The issue is even worse, if there is a button enabled on the first textbox: https://snipboard.io/Tz5tqN.jpg

[jarry]

Please call this enhanced code instead.

Code:

<div class="f-row">
	<div style="flex:1;margin-right: 20px;">
		<input class="easyui-textbox" label="Test1:" style="width: 100%;">
	</div>
	<div style="flex:1;margin-left: 20px;">
		<input class="easyui-textbox" label="Test2:" style="width: 100%;">
	</div>
</div>