[Resolved] Menu wrapping

Home Forums Support Menu wrapping

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1435983
    John

    How do I wrap menu items? I have a site that has 9 (ugh) menu items and like 2 of them are Technology Solutions As a Service and Professional Technology Services. I have 0 wiggle room to make that Technology SAAS.

    So am wanting to make it instead of

    Technology Solutions As a Service

    Technology Solutions
    As a Service

    (ideally centered, but broken onto 2 lines).

    Thanks for the help!

    #1436026
    Leo
    Staff
    Customer Support

    Hi there,

    You can use the <br> tag in navigation label field.

    Let me know if this helps 🙂

    #1436028
    John

    Here I was thinking of something fancier 🙂

    #1436031
    Elvin
    Customer Support

    Hi John,

    To add to Leo’s suggestion. You may have to add CSS.

    You can try this CSS code to adjust the line-height,paddings,margins and text alignment:

    .main-navigation .main-nav ul li a, .menu-toggle, .main-navigation .mobile-bar-items a {
        padding-left: 25px;
        padding-right: 25px;
        margin-top: 20px;
        margin-bottom: 20px;
        line-height: 20px;
    text-align: center; 
    }
    
    .main-navigation .main-nav ul{
       display:flex; 
       flex-direction: row;
       align-items: center; 
    }

    We also added “align-items” so it will be vertically centered, you can remove this if you prefer top alignment.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.