Issue with "Relative" element position when inside another control

When the controls are placed directly on the form and have elementposition set to 'relative' they get grouped by browser at start and then regrouped if the browser window changes the size, which is good.
However when i place my controls inside another control ( webpanel for example ) which has Align = 'alClient' controls are not responsive when the window size ( and the panel size ) is changing. Is this how it should be?

Than you.

Align only makes sense to absolute positioned controls.
When you count on the browser for layout with relative positioning, use things like WidthStyle,HeightStyle=ssPercent for exampklle

Thank you Bruno.
I think my explanation was confusing. I have 5 web panels they all are set to relative. Each panel contains controls which are absolute. When I put the panels on the form browser organizes them depending on the form/screen size, which is what I need. But if I have a webpagecontrol on the form and I drop my panels on one of the pages browser aligns them when starts but then when I change the size of the window it is just cutting them off.

What is the ElementPosition setting of the TWebPageControl?
What effect has the sizing of the browsr on the TWebPageControl? Is the TWebPageControl using any aligning?
There is way too little information to know what exactly you are doing and what you expect.

Twebpagecontrol alignment is ‘client’ and position ‘absolute’ so it is changing the size when the browser window changing the size.

I cannot see a problem

Scenario 1: relative positioned panels with absolute positioned controls on it in an absolute client aligned TWebPageControl:

Same scenario of relative panels with absolute controls in it directly on a form

If a problem persists, isolate this and provide a sample source project + exact steps to reproduce this.

Thank you, Bruno
That is exactly what I expected to get. I will check again to see what I am missing.

Sorry but i am testing it again and it is responsive when on the form directly and
is not when components are in 'client' panel
screen shots are attached

Thank you.

Forgot to comment the images. First 2 - panels are directly on the form (in browser and in project). Next 2 - panels are in the panel which is set to ‘client’ (in browser and in project) and if make the browser window smaller in the second scenario it doesn’t regroup the objects it just cuts them off.

Please send us a sample project so we can see here all these components, their settings, code used.

Two zipped project are attached. They are very simple. no code. forms designed in two ways.
First has 5 panels on the form set to 'relative' , each panel has controls set to absolute. it woks fine for me.
In the second project same 5 panels are placed in one panel which is set to 'client' ( position absolute )
This one doesn't group the panels properly. Relative (1.0 MB) Relative (920.5 KB)

To set the panel caption vertical centered, the panel has the attribute align-items: center.
It is this attribute that causes that the child panels are relative position in the main panel but vertically centered.
If you do not want this, use another container control, like a TWebHTMLDiv for example.

thank you. i will try