Align all the menu(nav bar) items in one row just after the logo

Site URL: https://ensodental.com

My site is using quite a few navigation links and its difficult to keep everything in one line. I want to format it in a way where there are essentially 2 header bars.

First bar will contain only the logo and the social media icons + phone and email.
Second bar will contain all the navigation menu items.

Something similar to this: https://santaclarafamilydental.com/

Have you tried choosing this layout?

Yes I have and it doesn't align properly. For some reason the menus don't line up in one row, but in multiple rows.

Attached the updated menu bar for reference. Also I have set the content width to use full page, not sure why it still uses only center half of the page.

16 hours ago, EnsoDental said:

Yes I have and it doesn't align properly. For some reason the menus don't line up in one row, but in multiple rows.

 

Attached the updated menu bar for reference. Also I have set the content width to use full page, not sure why it still uses only center half of the page.

You can choose it then we will give the code to make nav on one line

Ok my website uses the layout. as suggested. Can you send me the code @tuanphan

You can try this code

nav.header-nav-list {
    flex-wrap: nowrap !important;
}