Docs

[TomasJarvling]

On this page: test.nmuab.se we would like to have the same hover effect on the main menu as on http://www.dccommunication.se

1. On hover we would like to fill the background behind the menu text with the this color: rgb(255, 107, 0) and change the text into black.
2. Beneath the menu there is a smal, almost not visible line. Is it possible to change this into another color?

Tomas

[Christian]

Hey Tomas,

Please add the code below in your Appearance > Customize > Custom > CSS

.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 {
    background-color: rgb(255, 107, 0);
    color: #000;
    margin-bottom: 10px;
    box-shadow: none;
}

.x-navbar .desktop .x-nav > li > a {
    padding-top: 55px;
}

Thanks.

[Joao]

.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, .x-navbar .desktop .sub-menu a:hover, .x-navbar .desktop .sub-menu .x-active > a, .x-navbar .desktop .sub-menu .current-menu-item > a, .x-navbar .desktop .x-nav .x-megamenu > .sub-menu > li > a, .x-navbar .mobile .x-nav li > a:hover, .x-navbar .mobile .x-nav .x-active > a, .x-navbar .mobile .x-nav .current-menu-item > a {
color: black;
background: rgb(255,107,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: inset 0 4px 0 0  rgb(255,107,0);
}

2- As you dont have content you have the border of the navbar and footer toghter.

To change the line under navbar :

.x-navbar {
border-color: red;
}

For the footer line:

.x-colophon {
border-color: red;
}

Hope that helps,

Joao

[TomasJarvling]

It helped almost all the way to sweden:)
on this page: http://test.nmuab.se/kontakt/
how do I get rid of the black row beneath the orange background in the header? I would like the orange background to fill the entire space.
Tomas

[Rahul]

hey There,

I don’t see any black row beneath the orange background in the header. Do you mean the header color? Can you please provide a screenshot of the same?

Thanks

[TomasJarvling]

Take a look at the screenshot. I would like the orange background to go all the way down to the bottom of the header so that there is no black space beneath the “kontakt” link.
Tomas

[TomasJarvling]

hmm, i think i got it through the previous css code you provided.

[Friech]

Yup, it seems like.

Should you require any further assistance with X|THEME and Cornerstone, please feel free to get in touch with us.

Cheers!

[Author]

Posts