There are 2 sidebars. Left / right, both fold / unfold. But the problem is that with the width of the wrapper <1500px slightly different conditions are met, namely:

My screen is 1280px - when I enter the site, only the left sidebar is deployed (that is, the right side is hidden at this resolution) (by default (> 1500px), both sidebars are deployed). When you try to expand the right one, the left one collapses and the right one opens. and vice versa.

Since js, I only gradually begin to study, sketched the mega cost option.

How to implement it more correctly and not a crutch?

Link to jsfiddle in the comments. (For it doesn’t fit here, css should be cleaned for a very long time.) To make it work, move the curtain that stretches the 4th window (result window)

1 answer 1

To solve your problem, use the property @media. Example:

@media (min-width: 768px) { .сontent { witdh: 768px; } } @media (min-width: 1200px) { .сontent { witdh: 1200px; } }
  • Um, generally by. - stoner
  • @kiLLro then add an adequate example and write normally. - Vadizar
  • I explained in some detail? I just asked for help to rewrite / optimize js code. - stoner