open child menu to the left

Can you please include a link to your site?

Is there a way to set the menu on mobile devices to only show the top level menu items and not open menus until a users selects a top level item?

Could probably be done by adding some JavaScript, but just about every theme does it this way (expand the menu out fully on mobile devices). The reason is that if you click/tap on the top level menu item, then you get taken right away to the page that’s linked to that menu item, so it’s pointless to expand the submenu. If you didn’t have anything linked to that menu item, that would be OK, but then you would have to detect in your JavaScript what menu items are linked to another page and which are not.

@crouchingbruin thanks for your reply.

Unfortunately the site is in testing at the moment and we can’t provide a link.

I saw somewhere that there is a way to set the last menu item to display child menus to the left instead of the right but I searched again and can’t find it.

The issue with the mobile menus is a problem because we have 8 main menu items most with several selections on the first drop down and many of these selections also have child menus with several more items. The result on mobile devices appears as an endless stream of menu items.

To get the third level menus to open to the left on the last menu item, try adding the following rule to your child theme’s style.css file, or use a CSS plugin like Jetpack or Custom CSS Manager.

.blog-menu > li:nth-last-of-type(1) ul li:hover > ul {
   left: -240px;
}

that worked. Thanks,

Now we just need a solution for the mobile menu.