Home Forums Basel – Premium Template I want to increase the width of Menu to 80%

This topic contains 10 replies, has 2 voices, and was last updated by Elise Noromit Elise Noromit 1 week, 5 days ago.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #167819

    Bazaronet
    Customer

    Hi,

    I want to increase the width of Menu to 80% in mobile.
    Currently, it looks like half of the screen. Or is the menu width fixed in your theme?

    Is it possible to have dynamic size in nature with 80% of the mobile screen? if yes how?

    Current size: https://prnt.sc/qnf2qk
    I want Like this: https://prnt.sc/qnf37o

    Thanks & Regards,
    Sanjay Mahapatra

    Private Content Hidden
    #167834

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    .mobile-nav {
        width: 320px;
    }

    Set the width as per your needs on different screen widths the mobile nav takes a different part.

    Best Regards

    #167836

    Bazaronet
    Customer

    Hi,

    Thanks for the code but it’s breaking the home now.

    Please refer to Screen capture: https://prnt.sc/qngdav (You may also check the mobile version of my site at present your code is applied).

    Thanks,
    Sanjay.

    Private Content Hidden
    #167878

    Hello,

    Try this code:

    .mobile-nav {
        width: 80%;
    min-width: 300px;
    }

    Best Regards

    #167881

    Bazaronet
    Customer

    Still the same issue as of your previous code.

    Thanks,
    Sanjay.

    #167909

    Bazaronet
    Customer

    Any update?

    Thanks,
    Sanjay.

    #167951

    Hello,

    Sorry, I have checked twice the menu width cannot be changed with the CSS. It requires code customization which is not covered by our support.

    Best Regards

    #167988

    Bazaronet
    Customer

    Code coverage you mean this needs a code change in the Basel theme code? or any woocomerce default behaviour? If code change in Basel theme code, in this it may get override with any future updates right?

    Your theme is really a nice one, please bring this as a feature on your next update.

    Thanks,
    Sanjay.

    Private Content Hidden
    #168038

    Hello,

    Please remove the styles provided before and add these ones:

    .mobile-nav {
        width: 300px;
    }
    .mobile-nav-from-left .mobile-nav {
        left: 0;
        transform: translate3d(-300px,0,0);
        -webkit-transform: translate3d(-300px,0,0);
        -ms-transform: translate3d(-300px,0,0);
        -sand-transform: translate3d(-300px,0,0);
    }
    .act-mobile-menu .mobile-nav {
          transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        -sand-transform: translate3d(0,0,0);
    }

    You can change width in pixels only.

    Best Regards

    #168177

    Bazaronet
    Customer

    I guess its working so far. Thank you so much! Appreciate!

    Thanks,
    Sanjay

    #168184

    You are welcome! If you have any questions please feel free to contact us.

    Best Regards

Viewing 11 posts - 1 through 11 (of 11 total)

The topic ‘I want to increase the width of Menu to 80%’ is closed to new replies.