Issue with footer widget in Pro

Hi

Need help with footer menu formatting in Pro. Want the menu to be aligned to top vertically and in same line as the logo on its left hand side. Container setting is correct (horizontal - center; vertical - start). Have inserted the menu using widget. Using Uber menu.

Screenshot attached.

Thanks in advance

Hi There,

Thanks for writing in!

Can you please try adding a custom CSS to the elements? ex vertical-align: top; .
As I don’t have the access to your site can’t check the settings of elements, so it hard to suggest you a solution.

Please send us the details so that we can have a look.
Please provide following information:
Set it as Secure Note

  • Link to your site
  • WordPress Admin username / password
    All the best!

Hi

Have just set the information in secure note. Please check and suggest.

Hi there,

Please add this in the Global CSS:

.x-colophon .ubermenu-nav > li {
    vertical-align: top;
}

Hope this helps.

Hi

Thanks. The menu is vertically aligned now, but its alignment is still off with respect to the logo on the left. How do I bring the menu headers in the same line with the logo. Also, need help in changing the background color or the submenu items. Want to make it transparent or same color as footer background.

Thanks.

Hello @aguliya,

Thanks for updating the thread. :slight_smile:

Reason menu is still not aligned is because of margin-top CSS property that assigned to the footer widget in Theme CSS. To make the necessary changes I suggest you to first add a CSS class footer-widget-style to widget area element under Customize > Class. https://cl.ly/07451Y331B05

After that add following CSS under Pro > Theme Options > CSS:

.footer-widget-style .widget {
    margin-top: 1.6em;
}

.footer-widget-style .ubermenu-nav li {
    background-color: #f0f0f0 !important;
}

You can change the class name footer-widget-style as per your choice.

Thanks.

Hi

Thank you for the help. It’s working perfectly fine now.

Thanks.

We are delighted to assist you with this.

Cheers!

Hi

Need another help. Wanted to change color of menu items in footer to white with background as black.

I am using following CSS.

.footer-widget-style .ubermenu-nav li {
background-color: #000000 !important;
font-color: #ffffff !important;
}

While it is making the background color black, but the font color is not changing.

Please help.

Hi There,

Instead of the css you have written please use this CSS.

.footer-widget-style .ubermenu-nav li {
background-color: #000000 !important;
}
.footer-widget-style .ubermenu-nav li a {
color: #fff !important;
}

Hope this helps!

Hi

Thank you. It did help.

You are most welcome!

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