Top Navigation Width

Hello guys,

I have this strange issue. I am using the following code to increase the width of my top navigation:

@media (min-width: 1025px) {
    .site-branding {
        width: 150px;
    }

    #site-navigation {
        width: calc(100% - 150px);
    }
}

This seem to work on all pages except the home page. Just FYI, am using the Max Mega Menu plugin too. Can you suggest a work around? The development website is http://intelliassist.co.in/euronet.

Hello,

I’m not sure what exactly you want to achieve.

Can you please describe that more precisely?

Kind Regards, Roman.
aThemes Support

Hi Roman,

Thanks for the prompt response. I have two issues:

  1. On the homepage, my top menu items flows in two rows. However, on all other pages, they fit well in a single row. Kindly see: http://intelliassist.co.in/euronet. I want the homepage top menu to look like all inner pages. I am using Max Mega Menu plugin.

  2. No menu appears on the mobile device. I believe Max Mega Menu isn’t working with Perth. Is there a solution?

Hope this is now clear.

Hello, thank you for the explanation.

  1. You can try to replace this CSS code:
@media (min-width: 1025px) {
    .site-branding {
        width: 150px;
    }

    #site-navigation {
        width: calc(100% - 150px);
    }
}

…with this:

@media (min-width: 1025px) {
    .site-branding {
        width: 150px !important;
    }

    #site-navigation {
        width: calc(100% - 150px);
    }
}

.site-branding {
	padding-left: 0 !important;
}
.main-navigation {
	padding-right: 0 !important;
}
  1. Can you please create a new topic for this issue to keep the forum in good order and make it easier to help you?

Kind Regards, Roman.
aThemes Support

Hey Roman,

Apologies for the delay in responding. I tried the code today. This worked perfectly. I will create another thread for Max Mega Menu and mobile issue.

Cheers

That’s okay, you are welcome! :slight_smile:

Kind Regards, Roman.
aThemes Support