Red Background appears behind Centered Logo in Mobile View

Using help from the forum I was able to center my logo and it looks great in desktop. But when I switch to Mobile view I get a solid red background behind the logo instead of transparency. I am using Ubermenu and I assume this has something to do with the mobile Nav Button? How do I get rid of the red background?

Hi John,

Thank you for writing in, is that the site’s URL you’re working on below? Its under “Coming Soon” page. Please provide us login credentials in a secure note so we can take a closer look.

Thank you,

1 Like

Hi there was no secure note button on your reply so I added it to the OP… thanks for any help.

Hello John,

You seem to forget to add the username. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username

Thank you.

Done the user name has been added

Hi John,

Please double check password. It is incorrect.

I updated the password it is correct now… sorry

Hi John,

That background is coming from your UberMenu skin (fire), to change that, please add this to Theme Options > CSS

.ubermenu-skin-fire.ubermenu-responsive-toggle {
	background-color: transparent;
	border-color: transparent;

Hope it helps,

Well that almost worked… As soon as I hover over the navbar area the background reappears.

Well with your hint I sort of figured it out, but through a different method… I went into the ubermenu control panel, found the boxes that read “responsive toggle background” and resposive toggle background (Hover) and typed (transparent) into the color selector box for both of those settings and that got rid of the background, but it is not quite perfect, you still see the edges of the background on both sides… A little weird but looks better at last… if you know how to get rid of those edges let me know…

You see its like there is a 1 pixel black border around the responsive toggle background that is still there after you make the background transparent… Perhaps I need to bug the uber menu people about this… Thanks though you got me most of the way there…

Hi John,

It’s part of the Ubermenu skin that you selected, to remove it, please add this CSS as well

.ubermenu-skin-fire.ubermenu-responsive-toggle {
    border: 0px !important;
    box-shadow: none !important;

Hope this helps :slight_smile:

That worked perfectly, Thankyou!

We are happy to help,


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