Superfly menu custom css

Hi guys,

Tried to post in this thread: https://theme.co/apex/forum/t/superfly-menu-remove-site-title-and-tagline-space/23852/18 but it is already locked. Inputing the css in the child theme style.css file doesn’t have any effect either. Also tried the “additional css” in the Superfly menu settings - still nothing.

Is there a way to implement custom css to the Superfly menu?

Thank you,
Petar

Hello Petar,

Thanks for posting in!

You can add a custom menu in SuperFly Menu settings > Advance Tab.

It is taking effect on the front end because it is displaying in the source code of the page:

The logo should have a margin on top of 10 pixels;

Hope this helps.

Thank you so much for the info! Although the custom code has been implemented, the logo still didn’t its margin. What is more interesting, is once you use the browser’s inspect element feature, then the css code actually takes effect: https://streamable.com/ce2kj

The other case when the same is true is when I am being logged in: https://prnt.sc/irko7h

Any thoughts on that?

Hi there,

The margins are in-effect, but the issue is, it doesn’t change the offset positionin. You should modify it’s top positioning by adding this CSS

.sfm-toggle-hover #sfm-sidebar .sfm-logo {
    top: 50px !important;
}
#sfm-sidebar .sfm-nav {
top: -40px !important;
}

Hence, 10px difference from 50 and 40, it will become the space in between logo and menu.

Thanks!

1 Like

Great! Thank you so much for the help! The following css did the job:

/* Offset positioning */
.sfm-toggle-hover #sfm-sidebar .sfm-logo {
top: 10px !important;
}

``#sfm-sidebar .sfm-nav {
top: -40px !important;
}

Glad that you have managed to achieve your goal :slight_smile:

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