Expand width of sub-item (hover sub-menu)

Hello! I am using the Cali theme and am wondering how to increase the width of sub-items in the sub-menu? I do not want the text to wrap to the next line. This makes it look like it is another sub-item in the sub-menu and can be confusing to users. Thanks!

Hello there,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

@media only screen and (min-width: 1200px) {
  .main-navigation ul ul {
    width: 300px;
  }
}

Regards,
Kharis

Thank you for the information. That did expand the width of the box but the text is still wrapping. You can see what I am talking about under the “Gear” menu here: https://stateyourdestination.com/

Hello there,

Try adding the below CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1200px) {
      .main-navigation ul ul a {
        padding: 0 5px;
      } 
    }

Regards,
Kharis

Perfect! Thank you so much!

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis