Custom Navigation Menu

Hi there, I'm trying to get a navigation menu set up similar to in this example (ON MOBILE):

Where there is (from left to right) the logo, a call to action button, a pressable phone icon, a divider line and then the usual hamburger menu. I know it's a lot to squeeze in but that is what the client wants.

I know I could use custom code and I do know HTML and CSS however am a little out of practice so tend to forget how to do more specific things such as this!

I tried adding a navigation bar and adding the other elements to it but couldn't get them to move with the hamburger menu - aligned to the right side of the screen.

I tried making my own navigation bar and dragging in a navigation menu, but the menu wouldn't collapse on mobile by default and I couldn't find the option in responsive display.

I tried adding divs in rows / columns but the columns always stack vertically on mobile - as is usually desired!

Any ideas?


I've worked it out! As simple as adding a separate div, float right and position relative. I'm a bit rusty but hey it's fixed.

Feel free to archive / delete post.

Glad you got it worked out mot393!