[Resolved] Change layout breakout from 768px to 980px

Home Forums Support Change layout breakout from 768px to 980px

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1436081
    Deepak

    Hello Team,

    Currently by default the theme layout is set to change at 768px when both sidebars move below primary section.

    Is it possible to either
    1. Set break point for 980px when only right sidebar goes below primary content and the main screen only contains left sidebar+primary content and at 768px left sidebar goes down the primary content for mobile devices

    OR

    2. Move both sidebars to bottom at 980px instead of 768px

    I would prefer option 1 if possible. Can you please help me with the custom CSS required for this approach.

    I tried Menu plus element but it seems like it is only able to set the break point for MENU which I feel wrong, ideally we should give this option to end user so he/she can set a break point based on their requirement for entire website layout and not only for the MENU?

    Regards
    Deepak

    #1436328
    David
    Staff
    Customer Support

    Hi there,

    try this CSS:

    @media(max-width: 980px) and (min-width: 768px) {
        .site-content {
            flex-wrap: wrap;
        }
        .site-content .content-area {
            width: 75%;
        }
        #left-sidebar {
            width: 25%;
        }
        
        #right-sidebar {
            width: 100%;
        }
    }
    #1436340
    Deepak

    Thanks David.

    It worked perfectly.

    #1436474
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.