Home>Support>Specific menu items unfolding to the left

Specific menu items unfolding to the left

By aarthur, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hello,

I’m using Vantage Premium. I have a menu bar with four items, each with sub menus within them. I am wondering if I can make the sub menus for ONLY the right most element in my main menu unfold to the left instead of the right. How would I modify the CSS? I have already set up a child theme.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 4 months ago Andrew Misplon
    Hi, I Work Here

    Hi Sage

    Not sure this is perfect but give it a try:

    Appearance > Menus click Screen Options top right. Enable the CSS Classes checkbox.
    Edit the parent link item and enter a CSS Class in the field provided of:

    left

    Then go to Appearance > Custom CSS and add:

    /* If a class of left is added to a menu item, break drop down menu items to the left */

.main-navigation ul li.left ul {
  left: initial;
  right: -59px;
  text-align: right;
}

.main-navigation ul li.left ul ul {
  margin: 0;
  right: 100%;
}
  2. 10 years, 4 months ago aarthur

    Thanks for the response Andrew. When I try that out the sub sub menu actually overlays on top of the sub menu as shown here:

    http://i.imgur.com/27fBrCF.png?1

    I found another solution that changed all of the sub-sub menus to display on the left:

    /*
Make sub-menus open to left not right
*/
.sub-menu { 
	left: auto !important; 
	right: 0px !important; 
}
.sub-menu .sub-menu { 
	right: 200px !important; 
}

    Is there any way to apply this formatting to specific menu items?

    Thanks,
    Sage

  3. 10 years, 4 months ago Andrew Misplon
    Hi, I Work Here

    Thanks for the wait. Ahh ok, yeah don’t think I tested for the third level. You can swing a menu item left by inserting the class into the parent menu item CSS field so you should be able to control it that way. Has that not worked for you?

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More