• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.4 Set Custom Width at Which Sidebar Collapses (Responsive)

Russ

Well-known member
#2
Look at the bottom of sidebar.css:

Code:
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth)
{
   .Responsive .mainContainer
   {
      float: none;
      margin-right: 0;
      width: auto;
   }

     .Responsive .mainContent
     {
       margin-right: 0;
     }
   
   .Responsive .sidebar
   {
     float: none;
     margin: 0 auto;
   }

     .Responsive .sidebar .visitorPanel
     {
       display: none;
     }
}

@media (max-width:340px)
{
   .Responsive .sidebar
   {
     width: 100%;
   }
}
</xen:if>
Easiest method would be to just edit the : @media (max-width:mad:maxResponsiveWideWidth)

to, @media (max-width:1000px) or whichever you want.

For it to be specific to certain pages, you could paste that css inside the node html area inside a <style> </style> at the top of the html.