Moving the mega menu item icon to the right of the item - Forum | JoomShaper
Solved Helix Framework

Moving the mega menu item icon to the right of the item

Asked by Mike Lawson 5 years ago Last activity 5 years ago

Hello

By default, when I select an Icon for my mega menu item, the icon appears to the left of the menu item, how can I move the icon to the right of the item? Thanks

Accepted answer

Marked as the solution
Rashida Rahman Staff
5 years ago

However, there is an alternative way if you like it!

Here is sample code that you need to put in your custom CSS:

.sp-megamenu-parent > li > a {
    display: flex;
    flex-direction: row;
    align-items: center;
}
.sp-megamenu-parent > li > a span {
    order: 2;
}

Note: Path towards custom CSS:
Extensions>Templates>Styles>
Click on your current default template name then choose Template Options.
Then find custom CSS within the custom code.

https://prnt.sc/pu705g

https://prnt.sc/pu70zn

Hope this helps!

Best Regards

5 more replies

Oldest first Newest first Most helpful
Rashida Rahman Staff
5 years ago

Hi there!

There is no default way to do that actually.
There is positioning option only for the badge of the menu item.

However, you can give me your site url here to see if I can provide some CSS for you.

Best Reagrds

Mike Lawson Asked this
5 years ago

Hello

url is ata.spiderwebmichigan.com, added the site login under hidden content. Thanks

Rashida Rahman Staff
5 years ago

Hi,

I have checked, you havn't put any menu icon there.
Please put a menu icon then I will check again.

Best Regards

Mike Lawson Asked this
5 years ago

Rashida

That appears to have done the trick, I have added the css you provided. Thanks for your help

Rashida Rahman Staff
5 years ago

Glad to know that:)

You are always welcome!

Log in to reply.