Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 15, 2021 at 6:52 am #1310186
    BMMtOliveLC

    We have a menu hierarchy that starts at the Top Menu. Below that is a sub-menu, which has some entries that are themselves menus (sub-sub-menus for the purpose of this question). Right now when you hover over a sub-menu item that displays a sub-sub-menu, the first sub-sub-menu item is on the same horizontal line as the sub-menu item. That is, it appears as:

    <Sub-menu item> <First sub-sub-menu item>
    <Second sub-sub-menu item>
    etc.

    We would like to drop the sub-sub-menu down a horizontal line, so it appears as:

    <Sub-menu item>
    <First sub-sub-menu item>
    <Second sub-sub-menu item>
    etc.

    We think this is more readable. I tried inserting a dummy first sub-sub-menu item that had no link text, but Enfold would not accept it.

    Is there CSS that would achieve this objective?

    • This topic was modified 3 years, 2 months ago by BMMtOliveLC.
    July 15, 2021 at 2:54 pm #1310296
    BMMtOliveLC

    I am including an image to illustrate the current sub-sub-menu alignment (top example) and the desired alignment (bottom example). I am doing this since the markup used on this forum doesn’t allow items to be positioned in the horizontal direction. Therefore, the previous post shows examples that are aligned to the left. The image shows more exactly what we are seeking.

    https://drive.google.com/file/d/1UaH9ASdTqj8BLVNshyYiUJJiavuJySzW/view?usp=sharing

    • This reply was modified 3 years, 2 months ago by BMMtOliveLC.
    July 19, 2021 at 5:24 am #1310669
    Ismael

    Hi,

    Thank you for the inquiry.

    Would you mind providing a link to the site so that we can check it? We may need to actually see the sub menu in order to better understand the issue and provide a possible solution.

    Best regards,
    Ismael

    July 19, 2021 at 6:55 am #1310686
    BMMtOliveLC

    I have created a temporary admin user for you to use on test.mountolive.com. Credentials are in the private content part of this message.

    July 20, 2021 at 5:16 am #1310812
    Ismael

    Hi,

    Thank you for the info.

    We checked the site but we cannot find the menu that you described above. Which set of menu are you actually referring to? Please provide an actual screenshot of the menu that would you like to modify.

    Best regards,
    Ismael

    July 20, 2021 at 5:11 pm #1310907
    BMMtOliveLC

    I have included a link to a screenshot in the Private Content part of this message. The menu is at the top of the page under the menu item, “Member’s Only”, The sub-menu item is Member Information and the items we would like to move down vertically are “- Online Directory” and “- Update Contact Information”

    July 21, 2021 at 12:32 pm #1311118
    Ismael

    Hi,

    Thank you for the info.

    You can use this css code to move the sub menu item down.

    #top .sub_menu li li ul {
    top: 40px;
}

    If you want to only adjust the “Member’s Only” sub menu, use this css code instead.

    #top .sub_menu li #menu-item-6339 ul {
    top: 40px;
}

    Best regards,
    Ismael

    July 21, 2021 at 4:47 pm #1311179
    BMMtOliveLC

    Thanks. That worked perfectly (although I had to adjust the px number). You can close this ticket when you so choose.

    July 22, 2021 at 6:39 am #1311325
    Jordan Shannon

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Creating vertical space between menu item and first sub-menu item’ is closed to new replies.