Masonry makes all elements float:0

Question

I have a prestashop store in which I'm using a module I modified that works in another store, but not in the one I'm trying to install it now. Masonry loads fine, but it applies float:0 to all elements, making just one column instead of a mosaic as it should.

The url is www.myvintageshoot.com, there you can see the problem. I tried modifying the call function with different options, but nothing seems to work, and I don't know why the script put that 0 value.

score 0 · Accepted Answer · answered Jul 18 '16 at 16:10

Finally. When the first item is wider than the rest, masonry uses its width for the rest of the items, rendering the whole mosaic into a column. For that you have to set the width into the constructor, I did it using the smaller item's class, like this:

    var $grid = $('.masonry').masonry({
  // options...
  columnWidth: '.brick1x1',
  itemSelector: '.brick',
  });
  // layout Masonry after each image loads
  $grid.imagesLoaded().progress( function() {
    $grid.masonry('layout');
  });

Masonry makes all elements float:0

1 Answers1