Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #327059

    Hi:

    Kriesi told me to write here the issue so you can deal with it. Based on the built-in megamenu, I would like to know how to:

    1. Reduce the space between items in the submenu: paragraph spacing.
    2. Reduce the line spacing, since when the submenu text is too long, it is divided between 2 lines with a big space between them.
    3. Reduce the space above and behind the dotted line that appears when a column starts a new row.

    I have prepared a image so you can better check what I referreing to: http://goo.gl/vAkuYg

    Many thanks in advance and best regards.

    #327556

    Hey!

    Try adding this code to the Quick CSS:

    #top #header .avia_mega_div a {
        line-height: 18px !important;
    }
    #top #header .avia_mega_div>.sub-menu{
        padding: 10px 30px 10px;
    }
    #top #header .avia_mega_div>.sub-menu.avia_mega_hr{
        padding-top: 10px;
    }

    Cheers! 
    Josue

    #327744

    Hi Josue:

    I tried the code but there is not any change in the menu, any idea?

    Thanks,

    Jose.

    #327763

    Hey Jose!

    Disable/purge your caching/minifying after adding the code.

    Regards,
    Josue

    #327888

    I Josue:

    Great! Now it works and the result is as expected. Thanks!

    By the way, how can I also reduce the space between menu items and the line spacing in the normal menus so they have coherence with the changes just made in the megamenu?

    Many thanks in advance for your help.

    Jose.

    #328174

    Hi!

    Please add following code to Quick CSS as well and adjust as needed

    .av-main-nav>li>a { padding: 0 5px; }

    Cheers!
    Yigit

    #328494

    Hi Yigit:

    Thanks for the code but it reduces the right/left space between main header items instead of the space (height) between menu items and the line spacing in the normal menus.

    In other words, what I need is the same code Josue provided me for the megamenu but for the normal menu:

    #top #header .avia_mega_div a {
        line-height: 18px !important;
    }
    #top #header .avia_mega_div>.sub-menu{
        padding: 10px 30px 10px;
    }
    #top #header .avia_mega_div>.sub-menu.avia_mega_hr{
        padding-top: 10px;
    }

    Thanks!

    #329061

    Hey!

    You can add following code to Quick CSS as well

    .av-main-nav>li>a>.avia-menu-text {
    position: relative;
    top: 20px;
    }

    It would change the position of menu text. If you would like to change the height, please go to Enfold theme options > Header > Header Size and choose custom pixel value and set it as needed.

    Cheers!
    Yigit

    #332491

    Hi!

    I tested your suggested code but I does not work at all, it just changes the menu position/… instead of the submenu items. I need to reduce the space (height) between submenu items and the line spacing also in submenu items.

    I look forward to your reply.

    Thanks ;)

    #335347

    Hi!

    Add the following to Quick CSS:

    #top .av-main-nav ul a {
        padding: 0px 15px;
        line-height: 18px;
    }

    I would suggest playing with the 0 value for the padding and the line-height value to achieve the right spacing. Should you not see changes, please clear your cache or disable your cache plugin while you test. Adding the !important keyword like so:

    padding: 0px 15px !important;

    can help override and force changes.

    Best regards,
    Arvish

    #335670

    Hi Arvish:

    Thank your very much! Now it works as expected ;)

    Best regards,

    Jose.

Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Megamenu spacing’ is closed to new replies.