Tagged: , ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • December 14, 2023 at 2:47 pm #1428103
    NicomIT

    I am adding a dropdown menu to a website that previously only had one level of links and no dropdown/submenu. Things are looking good, except for two issues:

    1. When you mouseover one of the main section links in the menu, then try to move your mouse down to the dropdown, the dropdown disappears and you can’t select it or any of the links in it.

    2. Under the active menu item in the main menu links, the dropdown is not positioned correctly and is displaying approx. 45 pixels lower than it should. If you mouse over “About Us” (the active menu item) on the page provided in the private content below, you will see what is happening.

    Any help addressing these two things would be appreciated.

    December 15, 2023 at 3:29 pm #1428229
    Rikard

    Hey NicomIT,

    It looks like you have added some custom CSS to the site? If you want to align the main menu, then try aligning the whole menu using this class: .main_menu. Try adjusting the top margin. Then remove the 35px top margin from the links in the menu:

    #top #header_main > .container .main_menu ul:first-child > li > a

    Best regards,
    Rikard

    December 19, 2023 at 8:35 pm #1428526
    NicomIT

    Hi Rikard,
    I had some success with the menu and am close to having it display correctly. I am just having some issues with the current menu items in the dropdown menu for the page you are on. Some of them are displaying a green bottom border and all of them are displaying a green bottom border on mouse over. I provided links to two examples below.

    If you could help me remove those green borders from the current menu items in the dropdown, that would be great. We do want a green bottom border for the current menu item for the main section/parent links in the menu (Cargo & Operations, Cruise, Facilities & About Us). But the links in the dropdowns should not have that.

    Thanks!

    December 20, 2023 at 2:57 am #1428545
    Ismael

    Hi,

    Thank you for the update.

    If you could help me remove those green borders from the current menu items in the dropdown, that would be great.

    To remove the bottom border, please look for the following css rule:

    #top #header #avia-menu li.current-menu-item > a > .avia-menu-text {
    border-bottom: #7ac142 solid 10px;
    padding-bottom: 9px;
}

    Replace it with:

    #top #header #avia-menu > li.current-menu-item > a > .avia-menu-text {
    border-bottom: #7ac142 solid 10px;
    padding-bottom: 9px;
}

    Best regards,
    Ismael

    December 20, 2023 at 12:51 pm #1428593
    NicomIT

    Thanks Ismael. That worked and I am not seeing the bottom border under the current menu links in the dropdown. The padding looks to be different on those and not the same as the other links in the dropdown menu. There should be more space under the text when the darker background is displayed. It should have the same spacing/padding you see when you mouseover the other menu items in the dropdown. Can you let me know where to adjust that? Thanks for the help!

    December 24, 2023 at 2:18 pm #1428849
    Mike

    Hi,
    Thanks for your patience, when I review your submenu drop downs the padding seems to be the same for all items, 8px, so I’m not quite sure what you wish to achieve now.
    Below I included screenshots of the menus for your links, perhaps you could explain further and provide a mockup of what you wish to achieve

    Best regards,
    Mike

    January 3, 2024 at 2:14 pm #1429183
    NicomIT

    Hi Mike,
    Thanks for the reply. I was able to figure it out on my own.

    January 3, 2024 at 5:02 pm #1429193
    Rikard

    Hi,

    Great, I’m glad that you managed to come up with a solution. Please let us know if you should need any further help on the topic, or if we can close it.

    Best regards,
    Rikard

    January 3, 2024 at 6:08 pm #1429198
    NicomIT

    Thanks Rikard. It should be fine to close it.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Menu Dropdown Spacing & Not Able to Select Dropdown’ is closed to new replies.