No results found. Try again with different words?

Search must be at least 3 characters.

How to Change the Direction for Submenu Opening?

By default, the submenus will open to the right side. Sometimes if the submenu structure is long, it might open out of the viewport on the right and the user will not be able to see it. 

Astra Demo Submenu Opening

To fix this add the below-mentioned CSS class to the parent menu whose submenu is displaying out of the viewport.

ast-left-align-sub-menu 

For example: 
If following is the menu structure:

About
> About Team
>> Team Members
>>> Team Responsibilities
>>>> Team Contacts

Then add a CSS class ast-left-align-sub-menu to the parent menu – About Team  So that their sub-menus will open to the left instead of right. 

Detailed steps to add CSS class – 

Step 1: From the dashboard navigate to Appearance > Menus.

Step 2: At the top right corner click on Screen Options and enable the CSS Classes option.

Screen Options CSS Classes

Step 3: From the menu structure click on the menu whose submenu needs to be opened at the left.

Step 4: Add CSS class ast-left-align-sub-menu and click on save. 

Astra Submenu Options

Now the submenus will open like – 

Astra Submenu Opening Left

If you are still unable to change the directions in which your submenus are opening, please reach out to our customer support team and we will be happy to take a look into your website.

Was this article helpful?
Did not find a solution? We are here to help you succeed.

Related Docs

Astra is Free. Now & Forever.

We believe creating beautiful websites should not be expensive. That's why Astra is free for everyone. Get started for free and extend with affordable packages.

REWIND

YEAR IN REVIEW

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form
Scroll to Top
Now choose your preferred
page builder addon
Choose your preferred page builder addon

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form