Multiple Horizontal Layout Panels switch display order when Horizontal Layout is active

Having an issue that I can’t figure out. I have a canvas, and a main panel.

Inside the main panel, I have 2 other panels, which I’ve applied Horizontal Layout Components for as it’s a settings menu. The top panel is for the labels, the bottom panel is for the inputs.

When both horizonal layout panels are activated, the top one ends up underneath the second one when I run it in the editor(they are in the proper position in the UI screen). Same thing happens if only the top horizontal layout panel box is checked with the bottom one off. However, when I unclick the horizontal layout option from the top panel and just leave it active on the bottom one, it now displays in the correct order, albeit with the top panel not lining up anymore.

Why is this happening, and how can I get them to display in the proper order as they are in the UI?

UPDATE:

Found out what the issue was…the panels were defaulting to “stretch”…when I changed them to “top”, they stayed where they should have been