Tagged: drop down menu, dropdown navigation, mega menu
-
AuthorPosts
-
November 25, 2024 at 10:01 pm #1472195
Hello,
I’ve got a client who wants the mega-menu on the site to look like a specific example they found online. I’ve tried to modify the existing menu with my limited CSS skills, but can’t seem to get it to work.
Links for comparison are in the Private Content block.
Any help is appreciated!
Thank you,
Shane PoteeteNovember 26, 2024 at 7:20 am #1472219Hey BC-Clients,
Thank you for the inquiry.
Are you trying to decrease the space between the mega menu items? Try to add this css code:
#top #header .avia_mega_div > .sub-menu { padding: 2px 40px !important; border-top-width: 0; }
And to adjust the style of the links, include this:
#header .mega_menu_title { margin-bottom: 8px; font-size: 13px; line-height: 1em; font-weight: 600; display: block; font-weight: 400; }
You may need to leave the titles of the mega menu columns blank and add an actual menu item to each column.
Best regards,
IsmaelNovember 26, 2024 at 6:45 pm #1472298Hi Ismael,
Thanks for the reply! What you sent is part of the issue, but more importantly, it is getting the drop down mega menu to run FULL WIDTH of the screen and appear seamless with the upper navigation while also easing-in the menu links subtly like the example I sent previously (Quik Print site).
See screen capture in private content…
I’ve already incorporated the clients desired underline when active/hover over the main nav links, but they want our white mega menus to run the full width of the screen, and have all navigation sub-links ease-in/down top-to-bottom on dropdown load just like the Quik Print site. I’m unsure how to integrate this. I tried, but nothing I did would get the width to be full screen and the ease-in/down top-to-bottom effect wouldn’t work.
Any help is appreciated.
ShaneNovember 27, 2024 at 1:05 am #1472319can you post the link to that example page?
Is your header a shrinking one?
November 27, 2024 at 1:12 am #1472320Sure, here you go.
Here is the development site I am working on — Home page only right now (use the Services navigation menu link for comparison):
https://bclaunchpad.com/dev58/Here is a website with a mega-menu in the style they want to emulate:
https://qpokc.com/industries/associations-and-organizationsShane
-
AuthorPosts
- You must be logged in to reply to this topic.