Docs

[Claudia_Steigleder]

Hi,

I have a few questions

1.) How can I adjust the sub-menu (I want it to be underneath the navbar with a little space in between)?
2.) How can I remove the white stripe in the sub-menu (I want the whole box to be transparent and not rounded)?
3.) Is it possible to remove the blue stripe on top of the navbar?
4.) There is a fine line between navbar and header image, how can I remove that?
5.) I want the header image to be the same width as the navbar – how can I do that?

Thanks a lot in advance, hope you understand my points by seeing the screenshot.
The URL: http://s522797122.online.de

[Prasant Rai]

Hello There,

Thanks for writing in!

You can add this under Custom > CSS in the Customizer:

ul.sub-menu {
    top: 40px !important;
    background-color: transparent !important;
}

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: none !important;
}

.x-navbar {
    border-bottom: none !important;
}

Thanks.

[Claudia_Steigleder]

Thanks for the reply, but it doesn’t really help.

I already figured out to have sharp edges and transparency in the sub-menu and to place it underneath the navbar by adding

.x-navbar .sub-menu {border-radius: 0px;}
.x-navbar .sub-menu {opacity: 0.85;}
.x-navbar .desktop .x-nav > li ul {top: 25px;}

but there is still a white area on top and bottom of the submenu that shouldn’t be there.

And also the blue stripe that marks the current item is still visible.

Question 5 was how to have the header image the same width as the navbar (fullwidth, 1280 px).

Thanks

[Christopher]

Hi there,

Please add following code:

.desktop .sub-menu {

    padding: 0;
}

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: none;
}

Please disable Column container option.

Hope it helps.

[Claudia_Steigleder]

Thanks again for the kind support!

Disabling the column container helped, but the sub-menu still contains those white areas on top and bottom, how can I remove them? The code you gave me didn’t work.

One other question about custom menus:
The background color of the custom menu in the footer widget changes to white for the current item and hovering. So does it in another sidebar custom menu.

I want only the font to change the color (that works fine) but the background to stay the same color. Can you provide me a code for that?

Thanks

[Lely]

Hi There,

Look for this part on your custom CSS:

.x-logobar {
 text-align: left;{
    .textwidget a {color: #fff; text-shadow: none; font-size: 14px; font face="arial, regular">
</font>;}
   x-navbar {border-bottom: none !important;}

There’s CSS syntax error. Please update to this:

.x-logobar {
    text-align: left;
}
.textwidget a {
   color: #fff;
   text-shadow: none;
   font-size: 14px;
}
.x-navbar {
   border-bottom: none !important;
}

Make sure the proper open and curly brace is added correctly.
Then the CSS again from previous reply to remove submenu white bar on top and bottom part.

For the widget background color to stay the same, please use this custom CSS:

.widget_nav_menu ul li a:hover, .widget_meta ul li a:hover, .widget_pages ul li a:hover {
    background-color: transparent;
}

Hope this helps.

[Author]

Posts