Lines between menu items on footer

Support
#1

websozo.com/beestunning

I had support help me get the lines between the menu items on the header, but that code is not working the same for the footer. Please help.

ul.x-menu-line-between li {
position: relative;
}
ul.x-menu.x-menu-line-between li:after {
content: “”;
height: 18px;
width: 1px;
position: absolute;
z-index: 9999;
background: #ad7f32;
right: 0;
top: 15px;
}
ul.x-menu.x-menu-line-between li.menu-item-153:after{
background:none;
}

#2

Hi there,

Please add the class x-menu-line-between to the inline menu in the footer then add this code to the Global CSS:

.x-colophon ul.x-menu.x-menu-line-between li:after {
    top: 23px;
}

Hope this helps.

#3

Great!

I have another question. The dropdown menu items are causing the page to be extended after the footer. It’s creating a weird scroll effect. You can scroll past the footer and see the background because it’s making room for the dropdown submenu. Can I reverse the direction of the submenu drop down so it goes up instead?

#4

Hi There,

In that case please, provide us login credentials in a secure note so we can take a closer look.

In the meantime, please set all your footer bars height to auto.

Thanks,

#5

Done. See above Secure Note.

#6

Hi,

To reverse the direction of the dropdown, you can add the code below in Footer > CSS

.x-colophon .sub-menu.x-dropdown {
   top:auto !important;
   bottom:45px !important;
}

Thanks

#7

That worked great. Thank you.