Adjusting Sidebar Width?

[donnas]

How can I change the width of the sidebar…

I have Integrity-light, with full-width site layout, and content layout : content-left, sidebar right …and my sidebar is at 17% …I’ve tried CSS and it has no effect on it, and there is a huge gap between the content and sidebar, even though I reduced the padding on entry-wrap to 25px. The other part of the gap I can’t see in teh page inspection…there are no margins or padding left on the 2 elements, and it’s calculated somewhere. Please help. I need a little more space on my sidebar…at least when I’m viewing on a 32" wide monitor anyway…

By the way, I’m not the first person to ask this question…another person writes “is there a way to change the sidebar width” …and some idiot writes “regretfully no, that requires CSS” …WITHOUT SAYING WHERE OR WHAT?

[ruenel]

Hello @Donnas,

Thanks for writing in!

By default, the total width of the main content area and the sidebar is almost roughly 95%. The missing 5% is the gap between this two sections. If you want to increase the sidebar, it will require you to add a custom css instead so that you can override the width of the sidebar which is the difference of the total width (100%) minus the 5% gap and the width of the content which you have set in X > Theme Options > Layout & Design > Content Width.

To resolve this, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

@media(min-width: 980px){
    .x-sidebar {
        width: 28%;
    }
}

With the code above, the sidebar is overridden and set to have a 28% width assuming that your content width is at 70%. We left 2% as a gap between the two sections.

Hope this explains it briefly.