Submenu Getting Clipped in Mobile

Community Forums Forums Design Tips and Tricks Submenu Getting Clipped in Mobile

This topic is: not resolved

This topic contains 2 replies, has 3 voices, and was last updated by  Robodashy 5 months, 3 weeks ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #56215

    windy
    Participant
    Post count: 4

    Hi,

    It would probably be easier to explain this with a visual…On a regular desktop, let’s say that you right-click your mouse, and you are too close to the margin, the submenu automatically opens toward the ‘inside’ of the screen – where there is more room.

    On a desktop. when you hover over a primary menu item, and If you have multiple items for each submenu item, and you then rollover on those items, a secondary submenu opens to the right. So on a regular pc this is no problem.

    When you get to mobile, those submenus that are created on the right get clipped off. It almost makes me want to ask how to force that submenu to open to the left. But I don’t think that is the correct solution.

    I think a submenu should open to the ‘inside’ on mobile (not always in one direction or always to the right).

    I have been working with Legacy, but I have a feeling this would be the case with any other child theme. Is this a Genesis limitation, a mobile platform constraint, or is this just the way it works on mobile?

    Thanks,

    Windy

    • This topic was modified 1 year, 2 months ago by  windy.
    • This topic was modified 1 year, 2 months ago by  windy.
    #73598

    Susan
    Moderator
    Post count: 9255

    I see you posted this a while back, so I hope you got your issue resolved. If not, come back and check in, and I’ll escalate it for you…


    Susan @ Graphically Designing I offer theme customizations I tweet!
    I’ve taken up the challenge! – help me answer some of the unanswered posts

    #103134

    Robodashy
    Member
    Post count: 17

    Hi windy and Susan.

    I’m having a similar issue where I’m wanting to align the submenu of my last li to the right, so it doesn’t stick out over the right side of the main body (well, at least I think this is a similar issue to what windy is describing).

    I’ve looked at different ways of modifying the css to fix this, but can’t seem to find the right selectors to modify to get this effect.

    The effect I’m after can be seen working here:
    http://sevenspark.com/docs/ubermenu-align-items-right (the “Support” menu item under the search and social buttons)

    From looking at the CSS it looks like this is achieved by:
    ul.menu #menu-item-31 > ul.sub-menu {
    left: auto; right: 0;
    }

    I can’t find the equivalent styles in the Genesis css (modifying the hell out of the Sample child-theme) to make these changes.

    Any help would be greatly appreciated.


    The large print giveth, and the small print taketh away.
    - Tom Waits, “Step Right Up”

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.