-
Posts
-
On our site, we use sub-menus to organize access to various pages. Under the top menu, we have a sub-menu for Members Only pages. This sub-menu has a lot of items and I wanted to create sub-sub-menus to keep the number of menu items reasonable. However, when I created a sub-sub-menu under the Members Only menu, the sub-sub-menu items displayed to the left. On mobile devices, this meant that the sub-sub-menu items did not properly display. In particular, only part of the sub-sub-menu item showed. The other part (which contained the sub-sub-menu item name) was truncated by the mobile device left edge.
Is there any way to force all menu items, whether they are menu, sub-menu or sub-sub-menu items, to always display to the right?
Hey BMMtOliveLC,
Thank you for the inquiry.
We may have to inspect the site first in order to understand the issue properly. Please provide a link to the site with the sub menu issue — place the link in the private field. A screenshot will also help.
Best regards,
IsmaelI have created a temp admin account on test.mountolive.com. The credentials are in the private content part of this post. The issue shows up in the Church Information sub-menu item of the Members Only Menu at the top of the page. I couldn’t obtain a screen shot, since the menu only appears when the cursor sits on the “Church Information” item. So, I can’t use the cursor to make a screen shot. To reiterate. I would like the menu items to always display to the right at all menu levels. When viewed on a mobile phone, the “Church Information” menu items are not visible because they are to the left and off of the mobile phone display.
Hi,
Thank you for the update.
We can use this css code to move the sub menu to the right on both desktop and mobile view.
#top .sub_menu li li ul { top: -1px; right: -169px; left: auto; }Best regards,
Ismael
- The topic ‘CSS to force mobile devices to display sub-sub-menus to the right.’ is closed to new replies.