XF 2.1 Sidenav Width

[Sonnie]

Where do we control the width of the left sidebar?

 

[djbaxter]

AdminCP >> Appearance >> Style Properties >> Sidebar >> Sidebar and side navigation width

 

[Sonnie]

Hmmm.... not showing up in my Style Properties.

 

[djbaxter]

Hmmm....

I just checked and that's not a property for the Xenforo 2 default style but it is in my PixelExit custom style.

Try Admin CP >> Appearance >> Style Properties >> Page setup >> Sidebar >> Sidebar and side navigation width

 

[Sonnie]

Yeah... probably gonna need custom css to place in the extra.less template to control the left sidebar. It appears the left and the right are together. Or just change our ads for the left sidebar to 300px wide. But we needed something with 250px wide, thus why we had it like that in XF1.

 

[Bram]

Did you find a solution eventually @Sonnie?

 

[Sonnie]

We did not... we just changed our ads to be 300px wide.

 

[ge66]

I do think this in extra.less will work:

.p-body-sideNav
{
    width: 250px;
}

 

[JamesBrown]

Has anyone managed to have two separate widths for sidebar and sidenav. I have 160px wide sidebar and want a 300px wide sidenav. How can I do that? Cheers

 

[Nicolas FR]

Try this, adjust the side-bar settings to 300px and put this code on extra.less template

.p-body-sideBarCol
{
    width: 160px;
}

 

[JamesBrown]

Thanks, the sidebar went to 300 despite that in extra.less

 

[Nicolas FR]

So maybe change the code for this

.p-body-sideBar
{
    width: 160px!important;
}

 

[JamesBrown]

Thanks again, but that code won't override the 300px in the sidebar settings

 

[ge66]

If you set sidebarWidth to 160px
and use my suggestion above in extra.less:

.p-body-sideNav
{
    width: 300px;
}

 

[Nicolas FR]

So set sidebar width in Style properties to 160px and put this code in extra.less

.p-body-sideNav
{
    width: 300px;
}

 

[JamesBrown]

Thanks guys. this is the code that worked in the end..

.p-body-sideNavCol {
width: 300px !important;
}


Thanks Bob