I have not been able to find a way to use Isotope (or Masonry) with a fixed width outer container.
It always insists on re-sizing. I've looked through the options, code, google and here and haven't found the answer.
Is it even possible?
I have not been able to find a way to use Isotope (or Masonry) with a fixed width outer container.
It always insists on re-sizing. I've looked through the options, code, google and here and haven't found the answer.
Is it even possible?
Your question seems backwards to the problem I was having. Masonry works best with fluid containers but I wanted a fixed width of 980px on my center (main class ie: margin:0 auto; width 980px; )
Then masonry doesn't work... The fix is to find the center or whatever class u use to contain all content to a set width and change it from width to max-width:980px. This means ur still on fixed width centered container but masonry items will readjust / relayout upon resizing the browser.
I have a module I'm working on at www.digi2020.com - choose menu -> portfolio and u will see that does just this. I've added a lot of bells and whistles but a simple call to masonry will achieve same effect.
Inspect and Check out the .main class and the JavaScript on that page.
Another example using isotope on a fixed width that does not allow items to relayout on resize but still provides filtering can be found on pressedweb.com/portfolio
Usually this happens when you set the outer container to max-width
. I have used width:960px
and it does not interfere with the masonry grid after resizing the browser window. Maybe check all of your outer containers?