[Resolved] Menu Help!

Home Forums Support [Resolved] Menu Help!

Home Forums Support Menu Help!

Viewing 11 posts - 16 through 26 (of 26 total)
  • Author
    Posts
  • #1457620
    Elvin
    Staff
    Customer Support

    sorry about that, i just set the mobile menu breakpoint to 6000

    Nice, you’ll also want to remove the Menu label so only the hamburger icon is displayed.
    https://share.getcloudapp.com/Wnur25yb

    If you’ll check the menu items, you’ll see that they’re sticking to each other.

    That’s my bad, I forgot to add the spacing so they don’t stick too close.

    Here’s what you can do:

    .main-navigation .main-nav ul > li > a {
    width: max-content !important;
    writing-mode: vertical-rl;
    transform: rotate(-180deg);
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 15px;
    padding-bottom: 15px;
    }

    We’re basically just adding padding-top: 15px; and padding-bottom: 15px; for spacing on the previous CSS code we used.

    #1457645
    angelarose

    Great, thank that fixed the spacing!

    #1457777
    Elvin
    Staff
    Customer Support

    No problem. Let us know if you have further questions.

    Feel free to open new topics if you have any other concerns.:)

    #1457832
    angelarose

    Thank you! If I wanted to move that hamburger box to the right, left, or further down on the page, hwo would i go about doing that?

    #1457840
    Elvin
    Staff
    Customer Support

    Thank you! If I wanted to move that hamburger box to the right, left,

    You should be able to move your navigation’s alignment through Appearance > Customize > Layout > Primary Navigation.

    On this option, you should be able to see a Navigation Alignment dropdown. Set it to left or right.

    But. There’s a recently discovered bug that may prevent you from seeing the Navigation Alignment dropdown.

    Here’s a temporary workaround for it while we fix things.
    https://generatepress.com/forums/topic/primary-menu-center-alignment/#post-1457754

    …or further down on the page, hwo would i go about doing that?

    It depends. You can either do a custom CSS or place it on a different hook.

    We can only determine what’s the best way to go once we see actually know where its going to be placed.:)

    #1457858
    angelarose

    Ah great thank you! so I was able to move it by adding margin-top and margin-right to button.menu-toggle . But when you click on the hamburger, all the other content on the webpage moves down. How do you get it so that doesn’t happen? I’d like it so the page content doesn’t shft up or down when the menu is clicked on. Thank you!:)

    #1457871
    Elvin
    Staff
    Customer Support

    I’d like it so the page content doesn’t shft up or down when the menu is clicked on. Thank you!:)

    You can definitely do that too with CSS. 🙂

    #mobile-header {
        position: relative;
        overflow: visible;
    }
    
    #mobile-header > ul {
        position: absolute;
    }

    Let us know if it fits what you’re trying to do.

    #1457881
    angelarose

    thank you! so this is the page before hitting the toggle menu: https://ibb.co/k2PRFVp and this is the page after hitting the hamburger icon: https://ibb.co/FVrTFBK

    #1457886
    Elvin
    Staff
    Customer Support

    Oh my bad. It’s suppose to be this one.

    .main-nav {
        position: relative;
        overflow: visible;
    }
    
    .main-nav > ul {
        position: absolute;
    }
    #1457889
    angelarose

    Great, thank you! it worked perfectly!

    #1458470
    Elvin
    Staff
    Customer Support

    Nice one. glad to be of any help. 🙂

Viewing 11 posts - 16 through 26 (of 26 total)
  • You must be logged in to reply to this topic.