Child-Menus going off the screen

  • Reubz

    (@reubz)


    12 years, 6 months ago

    I’m having a problem with my child menus going off the screen. This screenshot shows what happens when I mouse over the Parent Menu (Red Square)and the resulting “Horizontal Scroll Bar” (Green Square)that appears at the bottom of my screen (which is not accessible since it only appears on a mouse-over on the parent menu.

    How do I stop this from happening??
    Is there a way to make the menu orientate in the opposite direction when it detects that it’s gone off the screen??? or something similar??

    This image was produced from a visitor to the site (Thanks)and I have since reproduced this occurrence on my test site that has NO plugins active, NO widgets inserted and NO custom CSS applied.

    Any help or advise would be much appreciated.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter Reubz

    (@reubz)

    12 years, 6 months ago

    Sorry, I forgot to mention that the child menus have kids too!!

    p.s these aren’t the real menu items – it’s from the test site

    Moderator Ipstenu (Mika Epstein)

    (@ipstenu)

    🏳️‍🌈 Advisor and Activist

    12 years, 6 months ago

    It’s a width issue. Change the width of the dropdown in your CSS to a max of … whatever that is. Or change the MIN width of the body to one that will support that menu.

    Thread Starter Reubz

    (@reubz)

    12 years, 6 months ago

    Thanks for your reply!

    Regarding your first suggestion, do you have any recommendation regarding the CSS that should be used or what it would like???
    I have used this code below to change the navigation menu font size:
    div.menu-top, #access .menu-header, div.menu {font-size: 18px;}

    I have used this code to center the navigation menu:
    div#access{overflow:hidden; width: 1000px; padding-left: 100px;}

    But due to my very limited knowledge of CSS, I have no idea what I would need to use to control the width of the drop down menu. I’d love any ideas…

    Regarding your second suggestion,changing the width of the website is impractical as it compromises the look & feel of my website in its entirety. Vast majority of the elements used (images, content layout, plugin customisations, maps, video, sidebar widths etc) are based on the website being a width of 1000px.

    Is there no way to make the menu orientate in the opposite direction when it detects that it’s gone off the screen??? or something similar??

    Anyway, I hope your CSS suggestions render my last question moot..

    Thanks heaps!!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Child-Menus going off the screen’ is closed to new replies.