[Resolved] Responsive screen width

Home Forums Support Responsive screen width

Viewing 9 posts - 31 through 39 (of 39 total)
  • Author
    Posts
  • #181085
    Tom
    Lead Developer
    Lead Developer

    Caching plugins make it near impossible to set a width with an option, which sucks for those of us not using any caching plugins.

    You can however tell the mobile menu to kick in at any width you want with this CSS: https://gist.github.com/generatepress/c23aef2d05807c39bb32

    Just change the 768.

    Be sure to star the gist as it will change in the future as the theme changes, and you’ll need to update the code.

    #181146
    Hamish

    Thanks Tom

    Can I add that straight to the SO custom css area? I just did and it isn’t doing anything.

    Would share the site but it local.

    I replicating an older site and trying to create Material / aka old school buttons. They actually look refreshing! 7 nav items. Number 7 was wrapping. The nowrap below isn’t the answer.

    Thanks again

    current custom css:

    .main-navigation ul {
    margin: 0;
    padding: 0;
    white-space: nowrap;
    }

    .main-navigation ul li {
    width: 13%;
    background-color: #403f3f;
    display: block;
    margin-left: 3px;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,0.2), 0 2px 3px 0 rgba(0,0,0,0.19);
    border-radius: 4px;
    }

    .inside-navigation.grid-container {
    max-width: 100%;
    padding-bottom: 8px;
    padding-left: 0px;
    }

    #181179
    Tom
    Lead Developer
    Lead Developer

    Yes adding that code to your custom CSS plugin should work.

    What size are you trying to initiate it at?

    #181461
    Hamish

    Works now. Thanks again. Have a good Easter !

    #181462
    Hamish

    Oh do you thinking caching is not good.? The speed increases seem significant

    #181464
    Tom
    Lead Developer
    Lead Developer

    Caching can be very good as long as you’re not actively working on the site. Having it enabled while development can cause a lot of headaches.

    Hope you have a good Easter as well πŸ™‚

    #529145
    Max

    Hi Tom,

    I have a rather busy primary navigation on the website that I am working on at the moment and I need to collapse it to a mobile-menu-type hamburger icon at a relatively large width.

    I used the css-code that you shared on https://gist.github.com/generatepress/c23aef2d05807c39bb32 in order to collapse it. While it generally works well after I changed a desired max-width to 1150px, I would like to change the position of the hamburger icon to the top right corner where the mobile menu icon is placed at the smaller screen sizes.

    Sadly, I don’t do any coding and I am learning how to build the website on the go.

    Could you please help me change your css to relocate the hamburger icon?

    The link to the temporary domain where I am constructing the site is: http://prjct1.atelier-mk.com/uk/ . Everything is in Cyrillic but I think that you will see the issue when you will try to resize the window to make it narrower.

    Thank you in advance!

    Regards,
    Max

    #529217
    Leo
    Staff
    Customer Support

    Hi Max,

    I think it’s best if you can open a new topic. This one is quite long already πŸ™‚

    #529291
    Max

    Hi Leo,

    Thank you. I will open a new topic as you suggested.

Viewing 9 posts - 31 through 39 (of 39 total)
  • You must be logged in to reply to this topic.