Menu dropdown width

  • ballmouse

    (@ballmouse)


    4 years ago

    I’d like to reduce the width of the menu dropdown. Here’s a photo of the current dropdown: https://imgur.com/nyojGaD. It’d be nice to get the width reduced to maybe it’s around the width of the red line.

    How can I make this change?

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Joy

    (@joyously)

    You should ask in your theme’s support forum. The menu is one of the trickiest parts of the theme.

    Gustav

    (@4ever16)

    Click ctrl+i and then elements. Select the menu and try to change width there.

    When you see that it changes see more information where that .css file is stored and then change it there.

    Refresh the page.

    Vlad T

    (@vladytimy)

    Hi, @ballmouse

    Try adding this in Dashboard – Appereance – Customize – Additional CSS in the Customizer

    #wide-nav .nav-dropdown {
    min-width: 216px;
}

    You can learn how to use the Chrome Developer Tools or Firefox Developer Tools to help you see and test changes to your CSS.

    As Joy suggested, you should ask your theme’s developer. Since you use a commercial theme (Flatsome), for future enhancements, please go to their official support channel. We feel they are best equipped to support their products. Commercial products are not supported in these forums.

    Also, I would not recommend modifying your theme files, otherwise your changes will be overwritten whenever the theme is updated. A custom CSS editor (Additional CSS) is found at Dashboard – Appereance – Customize – Additional CSS in the Customizer

    Hope this helps,
    Kind regards!

    Thread Starter ballmouse

    (@ballmouse)

    Thank you @vladytimy !

    What is the difference between writing CSS in Additional CSS and the Theme Editor? I see all my previous custom CSS is in the Theme Editor and when I wrote your code there nothing happened. But writing it in the Additional CSS area made the change.

    Also, is there any chance the width could be dynamic to be just large enough so the text per dropdown item fits on 1 line? 216 is exactly enough, but if I were ever to add an item with more text, it would be nice if it could automatically increase the length.

    Vlad T

    (@vladytimy)

    What is the difference between writing CSS in Additional CSS and the Theme Editor?

    Changes in theme files will be overwritten whenever the theme is updated. Additional CSS will not be overwritten.

    when I wrote your code there nothing happened. But writing it in the Additional CSS area made the change.

    Maybe #wide-nav .nav-dropdown {min-width: 216px!important;} will do the trick.

    Also, is there any chance the width could be dynamic to be just large enough so the text per dropdown item fits on 1 line? 216 is exactly enough, but if I were ever to add an item with more text, it would be nice if it could automatically increase the length.

    You really have to contact your theme developer via the link provided above ?? Commercial products are not supported in these forums.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Menu dropdown width’ is closed to new replies.