[Resolved] Navigation menu overhang logo.

[Sonador]

Hi,
I have purchased your premium theme and and I am using it with Elementor.
I have a problemwith logo logo in top navigation menu. I have set up an overhang effect, but it only shows on scroll, on page load it only shows half of logo, like its behind elementor section. How can i get it on top.
Here is the link http://www.go4cro.com/tset1/.

Also,i would like to set up the hover animation from your link :

https://docs.generatepress.com/article/adding-menu-hover-animation/

I have added the css, but nothing happens.

Thanx in advance.

Best regards,
Matko Petrović

[Leo]

Hi there,

Try updating this CSS you’ve added

.main-navigation .site-logo.navigation-logo img {
    height: 120px;
}

to this:

.main-navigation .site-logo.navigation-logo img {
    height: 120px;
    z-index: 1;
}

For hover effect, can you give this CSS a shot:

@media (min-width: 769px) {
    .main-navigation .menu > .page_item > a::after {
        content: "";
        position: absolute;
        right: 0;
        left: 50%;
        bottom: 15px;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);

        display: block;
        width: 0;
        height: 2px;

        background-color: currentColor;
        transition: 0.3s width ease;
    }
    .main-navigation .menu > .page_item.current-menu-item > a::after,
    .main-navigation .menu > .page_item > a:hover::after {
        width: 50%;
    }
}

[Sonador]

Wow, that was fast.
Yap, that did it.
2 out of 2 🙂
Tnx alot.

Just one more thing, i would like the underline to be constant blue color, and not to switch from white to blue.
Can you help with that too?

[Sonador]

Hi,
I figured it out…so its all good now.
Tnx for your help.

[Leo]

Glad I could help!

[Author]

Posts