header widget inline with menu?

also, how can i change the background color of a specific menu item (and hover color) and place a border on it? I am comparing which is better between placing a header widget or this one.

THanks.

Hi Allan,

- I'm assuming you have the navigation set to float right? If so try this CSS:

.nav-float-right .header-widget {
    display: inline-block;
    top: 0;
}
.nav-float-right .inside-header .main-navigation {
    clear: none;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

- Are you thinking about something like a button? If so check out this page:
https://docs.generatepress.com/article/adding-buttons/

Once the CSS is added, then you can add the classes to the CSS Classes field in your menu item:
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-classes

Let me know if this helps.

Hello,

Thanks it worked. I'm going for the button as it is still visible even on mobile.

I have another concern:

The height of my menu is 60 which is quite big. If I reduce it however, the entire primary menu changes its location and goes up resulting to it not being aligned with the logo. How can I reduce its height and at the same time, align with the logo on the left.

THank you..

by the way, here are some screenshots for reference:

Doesn't look like you have a tall logo so you could try to set the menu item height to the same as your logo height then it should be perfectly align in the middle like this GP site.

Let me know if that works for you.

THanks - working fine.

You're welcome :)