Hi, I am trying to build a header using Beaver Themer and want to make sure I am doing things correctly.
My header consists of two rows.
Top Row - Three Columns
The top row will have three columns. Column 1 is for logo, column two is for main menu that will be hidden on large screens but will display a hamburger menu on mobile. Column three has my social media icons, and these will only display on large desktop.
Second Row - One Column
The second row has one column and also contains the main menu, but it’s only displayed on large desktops and hidden on mobile.
Mobile
On mobile, I hide the third column on the first row, and I hide the second row, and I want the main menu on the second column to display the hamburger icon. This is working!
When I click Hamburger Icon
When I click the hamburger icon on mobile, I want it to display the main menu dropdown. This currently works, but my hamburger icon drops down to a new row. I am not sure why.
So my question is how do I get the mobile menu to open, but keep the hamburger icon in it’s column and simply show the menu below?
Thanks