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

    I’d like to use the Responsive Design Layout default (max width: 1030px) with a right sidebar increased to a content width of 300px and less margin of inner_sidebar of 30px (the only thing I’ve got).

    I spent hours to customize but failed due my own stupidity.

    What do I need to enter in the Quick CSS Option?

    #134427

    Hi,

    First, you need to decrease the template content div.

    @media only screen and (min-width: 1140px) {
    .responsive .container .nine.units {
    width: 660px;
    }
    )

    The sidebar’s width will increase automatically on this screen width because it is set to 100%.

    You need to use Media Queries to target the next screen size for the content, the sidebar will follow:

    .container .nine.units {
    width: 570px;
    }

    And another, to target smaller screen sizes:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
    .responsive .container .nine.units {
    width: 399px;
    }
    }

    We decrease the content width by 100px for each screen sizes therefore you will have a 100px bigger sidebar.

    Regards,

    Ismael

    #134428

    Got it :)

    Thanks for help Ismael!

    #134429

    Glad Ismael could help :)

    Let us know if you have any other questions or issues.

    Regards,

    Devin

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

The topic ‘Increase sidebar width’ is closed to new replies.