Describe the bug
In any form on the Settings page, when there are too many configuration items, not only does the ContentSection area get a scrollbar (which is expected and normal), but the Main component also gets an unnecessary additional scrollbar. Furthermore, the area outside the Main component is stretched, resulting in a large blank whitespace region.
This leads to poor visual experience and redundant scrolling behavior.
To Reproduce
Steps to reproduce the behavior:
1.Open the ProfileForm (or any form in the Settings page).
2.Add the following div to the form content to simulate excessive height:
<div className="w-40 h-2000 bg-red-500"></div>
Observe that:
ContentSection scrolls as expected.
An additional unwanted scrollbar appears on the Main component.
The area outside Main is stretched, creating a large blank region.
This results in redundant scrolling and poor visual layout.
Expected behavior
Only the ContentSection should scroll when content overflows; the Main component and outer layout should remain fixed without extra scrollbars or blank space.
Screenshots
If applicable, add screenshots to help explain your problem.
Additional context
Add any other context about the problem here.
Describe the bug
In any form on the Settings page, when there are too many configuration items, not only does the ContentSection area get a scrollbar (which is expected and normal), but the Main component also gets an unnecessary additional scrollbar. Furthermore, the area outside the Main component is stretched, resulting in a large blank whitespace region.
This leads to poor visual experience and redundant scrolling behavior.
To Reproduce
Steps to reproduce the behavior:
1.Open the ProfileForm (or any form in the Settings page).
2.Add the following div to the form content to simulate excessive height:
<div className="w-40 h-2000 bg-red-500"></div>Observe that:
ContentSection scrolls as expected.
An additional unwanted scrollbar appears on the Main component.
The area outside Main is stretched, creating a large blank region.
This results in redundant scrolling and poor visual layout.
Expected behavior
Only the ContentSection should scroll when content overflows; the Main component and outer layout should remain fixed without extra scrollbars or blank space.
Screenshots
If applicable, add screenshots to help explain your problem.
Additional context
Add any other context about the problem here.