Sub menu style

hello,

  1. i want to hide the lines between the sub menu.
    have tried to find the class via the browser and in this forum. did not find it.

  1. aditionally: i want the sub menu to be smaller (from the right side.)

how to?

live: https://dev2.homviotensin.de
(using latest pro theme)

thanks
oli

Hi Oli,

Thank you for reaching out to us. It seems like you’re using original header instead of Pro header. I’d recommend you to create a custom header using Pro header builder, this way you can customize every part of your menu without a need of custom CSS.

While using original header, you need custom coding to add / remove some features e.g. in your case you need to add the following CSS code in the Global CSS to remove the lines:

.x-navbar .desktop .sub-menu li:before, .x-navbar .desktop .sub-menu li:after {
    background-color: transparent;
}

Similarly, to control the width of the sub menus, you can make use of the following code:

.masthead-inline .x-navbar .desktop .sub-menu {
    max-width: 200px;
    min-width: 200px;
    left: 0 !important;
}

As you see this requires custom CSS so it’s better if you take advantage of Pro’s Header Builder to avoid custom CSS because sooner or later it always creates issues.

Please note that the code provided above serves as a guide only and is to help you in getting started so implementing it and maintaining the code will be out of our support scope and for further maintenance for new possible versions of the theme that may cause the customization to break, you will need to hire a developer.

Hope this helps!

1 Like

hello nabeel, thank you. it worked great. thanks again! oli ps i will look into pro header in the next project. :wink:

Hello @oblaum,

Glad that we were able to help you. Please feel free to reach us if you have any query regarding our theme and theme settings.

Have a great day!
Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.