UberMenu CSS Help

Support
#1

I need help with CSS and making UberMenu look like this.

#2

Hi There,

Thank you for the screenshot. Though I am not sure at the moment how your current Ubermenu looks. Ubermenu documentation though is very detailed. Please check the following links for guidance:




To directly inspect element that you need to change, please use browser developer tools.

Hope this helps.

#3

Would you be able to help with the actual CSS? It looks like this right now.

#4

Hello There,

To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you in advance.

#5

Sure thing

#6

Hi there,

I think you almost got it, then I went ahead and changed text color and box’s border radius :slight_smile:, and this custom CSS as well

.ubermenu .ubermenu-item.ubermenu-item-level-0 {
    border-right: 1px solid #ccc;
}
.ubermenu .ubermenu-item.ubermenu-item-level-0:last-child {
    border-right: 0px;
}

Thanks!

#7

Thank you! Where did you add this?

#8

Hi there,

It was added in Appearance > UberMenu > General Settings > Custom CSS.

#9

Ok, thanks

#10

You are most welcome!

#11

How did you end up setting the first button to a constant purple?

#12

Hello There,

The constant purple is the active menu item or the current page menu item. This will change if you go to the next menu item and the active menu item will be pass on to the next page that you are current on. If you want to change the colors for the active state and hover state colors, please go to Appearance > Ubermenu > Main UberMenu Configuration > Style Customizations.

Hope this helps.

1 Like
#13

Great, thank you!

#14

You are welcome!

#15

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