When you edit your header with the header builder you can see an area with three rows that contain three columns each. They represent three parts of your website header: top bar, main header, and header bottom part. All of these columns are drag & drop container areas so you can add any elements inside them and simply drag & drop them between columns. In such a way, you can compose any kind of layout and set any order for your header content elements.
Rows and columns settings
Each part of the header has its own settings and you can click on the “Edit” icon to configure their height, color schemes, borders, etc. On this configuration popup, you can also mark this row to be stuck on scrolling, hide on mobile and/or on desktop devices, add the bottom border line, set a background color or image, and choose row layout structure.