Menu item runs off the screen. Many answers in this forum, none work.

Edit: I centered the menu and that solved / avoided this immediate problem.

“Group where anyone can post” is a submenu item in the right column of my menu. Several characters run off the screen to the right. Solution?

I added the following to my “Additional CSS”. I added each item one at a time, until eventually I did try a few things at once, which resulted on all the text being to the left of the white drop down background.

As seen in the code, the specific element’s class is .menu-item-4556.

.header-navigation ul ul ul.sub-menu {
right: 100% !important;
left: unset;
}

ul.dropdown-menu ul li
{
right: 100% !important;
left: unset;
}

.menu-page-container .menu ul .menu-item-4556 ul li.focus > ul,
.menu-page-container .menu ul .menu-item-4556 ul li:hover > ul {
right: 100%;
left: auto;
}

.header-navigation ul ul ul.sub-menu
.menu-item-4556 ul li.focus > ul,
.menu-page-container .menu ul .menu-item-4556 ul li:hover > ul {
right: 100%;
left: auto;
}

.dropdown-menu ul.sub-menu
.menu-item-4556 ul li.focus > ul,
.menu-page-container .menu ul .menu-item-4556 ul li:hover > ul {
right: 100%;
left: auto;
}

.dropdown-menu.sub-menu
.menu-item-4556 ul li.focus > ul,
.menu-page-container .menu ul .menu-item-4556 ul li:hover > ul {
right: 100%;
left: auto;
}

• This topic was modified 19 minutes ago by Jonathon N.

The page I need help with: [log in to see the link]