Cheers!
Sorry for my english.
You would need to drop down the floating mega menu about 30 px. Could someone give me a hand?
The megamenu covers a part of the header and it is very ugly.
Thank you very much in advance!
Hi,
Normal when you are using mega menu, this should be display under the main menu -> https://i.imgur.com/kCn32ke.png
Thank you!
Thank you very much for your answer. Maybe I have not explained myself well. I am translating with Google Translator.
I would like the floating module of the mega menu to drop 30 pixels down. I want to push down it 30 px. This is possible?
The mega menu module cover an important part of the header.
I have verified that in the “search” option of the header, it is possible to lower the height of the floating form. See this example: https://ibb.co/D9H4pgR
I want get the same with the mega menu.
This is I have: https://ibb.co/ZHpYDhL
This is I want: https://ibb.co/fr1PJNt
Is it possible to lower the floating module of the mega menu by 30 px as in the screenshot?
Thank you,
Hi,
Unforgettably there is no option for this, but you can do it using a custom css -> https://i.imgur.com/EkbRCHs.png
.tdb-mega-menu .sub-menu > li {
margin-top: 30px!important;
}
The code need to be set in theme panel> custom code> custom css.
Thank you!
Fantastic solution, Calin! Thank you very much for your kind answer.
One last thing. I have 2 mega menu on the site (in the header, and the sticky menu when scroll).
Would it be possible to assign different pixels for each of the menus?
The extra class for the main menu is “menu-header” and the one for the sticky menu is “sticky-menu”. menu-header needs 0px and sicky menu needs 30px.
Thank you very much for your support and your patience. 5 stars for you.
Hi frangonzalez,
Thank you for your kind words! also sorry for the late answer, we had a day off!
Yes, you can use different css for main header menu and sticky header, you can try this custom css
.tdb-mega-menu .sub-menu > li {
margin-top: 30px!important;
}
.td-header-sticky-smart .tdb-mega-menu .sub-menu > li {
margin-top: 0px!important;
}
You can replace the above code with this one.
Hope this is what you need!
Thank you!
Hello from Spain, Calin!
Thank you very much for your kind answer!
Unfortunately, the sticky menu code seems to have no effect. I have modified the pixels, but the menu always remains the same.
I am sending you a new screenshot so you can verify that the code does not generate any changes.
link: https://imgur.com/a/tyLKxkm
Thank you very much beforehand for your help.
Hi Calin!
I recorded this video for you. Check it please!
https://drive.google.com/file/d/12WD1gyLk1ffc2D6BYrqknwJcShyYUGNb/view?usp=sharing
Thank you!!
Hi,
Please provide me a link to your website, in this way i will be able to provide the right css that it will work for you!
Thank you for your understanding!
Hi Calin! Thank you for your answer.
You can check it in: https://www.menteyciencia.com/mente-y-ciencia/
The pass is 123456789
Thank you very much!
Hi,
Please try this custom css:
https://i.imgur.com/oSkOObR.jpg
.td-header-desktop-sticky-wrap .tdb-mm-align-screen .tdb-menu .tdb-mega-menu .sub-menu {
margin-top: 25px;
}
and this it will be the code for both headers -> https://i.imgur.com/vTsptd6.png
.tdb-mm-align-screen .tdb-menu .tdb-mega-menu .sub-menu {
margin-top: -5px;
}
.td-header-desktop-sticky-wrap .tdb-mm-align-screen .tdb-menu .tdb-mega-menu .sub-menu {
margin-top: 25px;
}
Hope it will help you!
Thank you!
Thank you very much!!! You did it!! đ
You’re the best, Calin!!
Nice weekend and congratulations!!
