Submenu Help Part 2

  • Resolved scorendesign

    (@scorendesign)


    8 years, 8 months ago

    In my example https://gsmile.org/Divi-Docs/sub-menu-2.jpg, the background doesn’t extend to the right of the longest line. I’ve tried several things, without success. Here’s what I’m using at the moment:

    .nav li ul {
    width:300px;
    }

    I’d obviously like a flexible width. What style controls this?

    Appreciate tips on how to better to troubleshoot issues like this — I currently use Firefox > Inspector, but it’s hunt and peck and I’m not always successful.

    (Dev site, https://gsmile.org/Word-Dev/ )

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    Something like

    .nav ul li ul li {
width: auto;
}

    It may be ul ul or ul ul li, but that’s the gist of it. You want to set the width of the sub-menu list items to “auto”.

    Thread Starter scorendesign

    (@scorendesign)

    Great. Thanks!

    This version seems to work for me:

    .nav li ul {
    width:auto;
    }

    I’ll do some more testing.

    Thread Starter scorendesign

    (@scorendesign)

    Ended up using:

    /* extends submenu backgrounds to include longest line */
    .nav li ul {
    width:auto;
    }

    /* positions submenus at right edges of parent */
    .nav li li ul {
    left: 100%;
    }

    And everything seems right.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Submenu Help Part 2’ is closed to new replies.