Menu Bar Settings

Hi, I need help regarding the menu bar,

1 - I want to make the gap between the logo and menu items and I don’t know how it’s possible to make space between them when I try then both logo and menu items automatically align above each other.

2 - Moreover, the colour of the active menu item text should be changed with bottom line.

3- Make a border for the specific menu item.

Looking forward to hearing from you kind guidance. Thanks

Hey there,

so basically you can only use the space that is there. You could:

  • change the padding between the menu items
  • make the font smaller
  • remove one of the menu items (e.g. the social, if that is for social media. Use icons instead)
  • or make the logo smaller
  • change to burger menu in desktop mode

I have tried the first way and it looks a bit better when changing the padding:

Currently, when you try to change the color of the text when the trigger is active, you need to add the following code to the CSS:

.ed-menu>ul>li>a.active {
	     color: $color-primary;
	 }

Have a look:

image

We will discuss internally, if we do realize this via the style panel to make it more accessible.

The appearance of the menu item when triggering can also be changed in the style panel under menu item.

Let me know it that helps.

code of active menu item colour is working but I am still unable to create space between logo and menu item,

Note** not allowed from client to change the size of logo and font, or remove menu item.

can you please do for me or share with me the screenshot of each step, just like you shared above for padding, I tried to change padding but didn’t work.

One more thing I don’t how can I change the burger menu.

I am sorry for too many queries, a bundle of thanks would be for your help. Thanks

Hey there,

Let me give you my PayPal account for this . Haha, joke. No worries :slight_smile:

Could you give me the preview link or the six-digit website ID? Happy to check and record you a screencast.

Sure, here it is 345298